﻿@charset "UTF-8";

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav.gnav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav.gnav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*================================================
 *  一般・共通設定
 ================================================*/
body {
	font-size: 14px;
	font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	line-height: 1.6;
	-webkit-text-size-adjust: 100%;
	background:#d6ebf5;
}

#contents {
	overflow:hidden;
	width: 980px;
	margin: 0 auto;
	padding: 0;
}

header + #contents {
	padding-top: 60px;
}

.inner {
	position: relative;
	width: 980px;
	margin: 0 auto;
}

article {
	position: relative;
    box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding:20px;
	background:#fff;
}

section {
    box-sizing: border-box;
	width: 100%;
	margin: 0 0 2em;
	padding:0;
}

#main {
	position: relative;
    box-sizing: border-box;
	width: 100%;
	margin: 0 0 2em;
	padding:20px;
	background:#fff;
}

a {
	color:#39c;
	text-decoration:underline;
}
a:hover {
	color:#39c;
	text-decoration:none;
}

a.disabled {
    pointer-events: none;
}

h2 {
	margin-bottom:1em;
	padding:10px 0 10px 3px;
	font-size:24px;
	font-weight:bold;
	color:#333;
	border-top:3px solid #2077b7;
	border-bottom:1px dotted #2077b7;
}

h4 {
	margin-bottom:1.25em;
    padding: 0.5em 0.75em;
	font-size:20px;
	color:#fff;
    background-color: #62a6cb;
	border-radius:6px;
}

h5 {
	margin-bottom: 0.5em;
    padding: 0;
	font-size:16px;
	font-weight:bold;
}

p {
	margin:0 0 1em 0;
}

img {
	max-width: 100%;
	vertical-align: bottom;
}

em {
	font-weight: bold;
}

strong {
	font-size:20px;
	font-weight:bold;
	line-height: 1.6;
}

.red{
	color:#d00;
}

ul,ol,dl {
	margin:0 0 1em 0;
}
ul li {
	list-style:disc;
}
ol li {
	list-style:decimal;
}
li {
	margin-left:1.5em;
	line-height:1.8;
}

dt {
	margin-bottom:0.5em;
	border-bottom:1px dotted #ddd;
}
dt:before {
	content:"\0025a0";
}
dd {
	margin-bottom:1em;
}

table {
    box-sizing:border-box;
    width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ccc;
	background:#fff;
}
th {
	padding:10px;
	text-align:left;
	vertical-align:middle;
	border:1px solid #ccc;
	background:#eee;
}
td {
	padding:10px;
	text-align:left;
	border:1px solid #ccc;
}

/*================================================
 *  汎用クラス
 ================================================*/
.pc {
    display: block;
}

.sp {
    display: none;
}

@media screen and (max-width:979px) {
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }
}

.mb5 {
	margin-bottom:0.5em;
}
.mb10 {
	margin-bottom:1em;
}

.pt5 {
	margin-top:0.5em;
}
.pt10 {
	margin-top:1em;
}

/* 中央寄せ */
.center {
	text-align: center;
}

/* 左寄せ */
.left {
	text-align: left;
}

/* 右寄せ */
.right {
	text-align: right;
}

/* 写真中央寄せ */
.imgC {
	clear:both;
	overflow:hidden;
	margin: 0 auto 50px auto;
	margin-bottom:50px;
	text-align:center;
}
.imgC img {
	margin-bottom:10px;
}

/* 写真左寄せ */
.imgL {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
}
.imgL img {
	float:left;
	margin:0 10px 0 0;
}

@media screen and (max-width:767px) {
	.imgL {
		margin-bottom:20px;
	}
	.imgL img {
		float:none;
		margin:0 0 10px 0;
	}
}

/* 写真右寄せ */
.imgR {
	clear:both;
	overflow:hidden;
	margin-bottom:50px;
}
.imgR:last-child {
	margin-bottom:0;
}
.imgR img {
	float:right;
	margin:0 0 0 10px;
}

@media screen and (max-width:767px) {
	.imgR {
		clear:both;
		overflow:hidden;
		margin-bottom:20px;
	}
    .imgR:last-child {
        margin-bottom:0;
    }
	.imgR img {
		float:right;
		margin:0 0 10px 0;
	}
}

@media screen and (max-width:500px) {
	.imgR {
		clear:both;
		overflow:hidden;
		margin-bottom:0;
        text-align:center;
	}
	.imgR h4 {
        text-align:left;
	}
	.imgR p {
        text-align:left;
	}
	.imgR img {
		float:none;
		margin:0 0 10px 0;
	}
}

/* 2カラム（スマートフォンでは1カラム) */
.twoCol {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	position:relative;
	overflow:hidden;
	margin-bottom:0;
}
.twoCol .inner {
	position: relative;
	overflow:hidden;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-direction: column-reverse;
	-webkit-box-direction: reverse;
	-webkit-flex-direction: column-reverse;
	flex-direction: column;
	width: 47.5%;
	width: calc((475 / 980) *100%);
	height: auto;
	margin:0;
}

.twoCol .inner h4 {
	width: 100%;
	margin-top: 0.5em;
	text-align: left;
}
.twoCol .inner p {
	width: 100%;
	margin-bottom: 0;
	text-align: justify;
}
.twoCol .inner > a {
	width: 100%;
	height: 100%;
}
.twoCol .inner .image {
	width: 100%;
	min-height: 0%;
}
.twoCol .inner .btn {
	margin-top: auto;
	padding-top: 20px;
}
.twoCol .inner .text {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	pointer-events: none;
}

/* 3カラム（スマートフォンでは1カラム) */
.threeCol {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	position: relative;
	overflow: hidden;
	margin-bottom:0;
}
.threeCol .inner {
	position: relative;
	overflow: hidden;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-direction: normal;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	flex-direction: column;
	width: 32.14%;
	width: calc((315 / 980) *100%);
	margin: 0;
}
.threeCol .inner h4 {
	width: 100%;
	margin-top: 0.5em;
	text-align: left;
}
.threeCol .inner p {
	width: 100%;
	margin-bottom: 0;
	text-align: justify;
}
.threeCol .inner > a {
	width: 100%;
	height: 100%;
}
.threeCol .inner .image {
	width: 100%;
	min-height: 0%;
}
.threeCol .inner img {
	width: 100%;
}
.threeCol .inner .btn {
	margin-top: auto;
	padding-top: 20px;
}
.threeCol .inner .text {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	pointer-events: none;
}

@media screen and (max-width:767px) {
	.threeCol {
		display: block;
		margin-bottom: 20px;
	}
	.threeCol .inner {
		width : 100%;
		margin: 0 0 10px 0;
	}
}

.col_two_one {
	overflow:hidden;
	margin:0;
}

.col_two_one ul {
	overflow:hidden;
	margin:0 -2% 0 0;
}
.col_two_one li {
	list-style:none;
	float:left;
	width:48%;
	margin:0 2% 2% 0;
}
.col_two_one li:nth-child(2n+1) {
	clear:both;
}
.col_two_one li img {
	width:100%;
	margin-bottom:2.5%;
}

@media screen and (max-width:500px) {
	.col_two_one ul {
		margin-right:0;
	}
	.col_two_one li {
		width:100%;
	}
	.col_two_one li:nth-child(2n+1) {
		clear:both;
	}
}

/*================================================
 *  トピックパス（パンくずリスト）
 ================================================*/
#topicpath {
	font-size:12px;
	margin-bottom:20px;
	padding:2px 4px;
	background:#f1f1f1;
}

/*================================================
 *  ヘッダー
 ================================================*/
header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height:auto;
	background: #fff;
	z-index: 100;
	border-top:5px solid #0082b4;
	border-bottom: 1px solid #ccc;
}

header:after {
	content: ""; 
	display: block;
	clear: both;
}

.headerInner {
    position: relative;
    box-sizing:border-box;
    width: 100%;
    margin: 0;
    padding: 0 15px;
}

header h1 {
	float: left;
	margin: 10px 0;
	padding: 0;
}

@media screen and (min-width:960px) {
	header h1 img {
        height:39px;
	}
}

@media screen and (max-width:959px) {
    header h1 img {
        height:30px;
		margin: 0 0 0 10px;
    }
}

/* ヘッダーナビ */
.headNavi {
    position: absolute;
    top: 10px;
	right:50px;
}

/* ヘッダーナビコンタクト */
.headNaviContact {
	box-sizing:border-box;
	width:100%;
	overflow:hidden;
	padding: 0;
}

.contactBtn {
    float:left;
}

.contactTel {
	float:left;
	margin-right:15px;
}

@media screen and (min-width:768px) {
	.contactTel .directLine {
		float:left;
		margin: 0 0.75em 0 0;
		padding: 0;
		line-height: 2.0;
	}

	.contactTel .phonenumber {
		float:left;
		margin: 0;
		padding: 0;
		line-height: 2.0;
	}
	
	.contactTel .directLine img {
		width:auto;
		height:30px;
		margin: 0;
		padding: 0;
	}
	
	.contactTel .phonenumber img {
		width:180px;
		margin: 0;
		padding: 0 0 3px;
	}
}

@media screen and (max-width:768px) {
	.contactTel .directLine {
		float:left;
		margin: 0 0.75em 0 0;
		padding: 0;
		line-height: 1.0;
	}
	
	.contactTel .phonenumber {
		float:left;
		margin: 0;
		padding: 0;
		line-height: 1.0;
	}
	
	.contactTel .directLine img {
		width:auto;
		height:30px;
		margin: 0;
		padding: 0;
	}
	
	.contactTel .phonenumber img {
		width:180px;
		margin: 0;
		padding: 0 0 5px;
	}
}

.headNaviContact div.lineBtn {
	float:left;
	margin-right:10px;
}
.headNaviContact div.lineBtn img {
	width:30px;
	height:30px;
	border-radius:3px;
}

.headNaviContact div.bankBtn {
	float:left;
	margin-right:10px;
}
.headNaviContact div.bankBtn img {
	width:38px;
	height:30px;
	border-radius:3px;
}

.headNaviContact div.mailBtn {
	float:left;
	margin-right:0;
}
.headNaviContact div.mailBtn img {
	width:28px;
	height:28px;
	border:1px solid #ccc;
	border-radius:3px;
}

.headNaviContact div:nth-child(4n+1) {
	clear:both;
}

@media screen and (max-width:767px) {
    header h1 img {
    	box-sizing:border-box;
        width: 100%;
		margin: 0 0 0 10px;
		padding: 0 60px 0 0;
    }
    
	.headNavi {
	    position: static;
	    top: 0;
	    box-sizing:border-box;
		width: 100%;
		margin-bottom: 10px;
		padding: 0 10px;
	}
	
	.headNaviContact {
		overflow:hidden;
		margin:0;
	}
	
	.contactTel .directLine img {
		width:auto;
		height:28px;
	}
	
	.contactTel .phonenumber img {
		width:160px;
		padding: 0 0 6px;
	}
	
	.contactBtn {
		float:right;
	}
}

/*================================================
 *  HOME
 ================================================*/
.top_entry {
	overflow:hidden;
	position: relative;
    box-sizing:border-box;
	width: 100%;
	margin:0 auto 2em;
	padding: 20px;
	background:#fff;
	border-radius:5px;
}

.top_entry .twoCol {
	margin-bottom:1em;
}

.phonenumber {
	margin: 0;
	padding: 0;
	line-height: 1.0;
}
.phonenumber img {
	width: 100%;
	margin: 0;
	padding: 0;
}

.spnumber {
	margin: 0;
	padding: 0;
	line-height: 1.0;
}
.spnumber img {
	width: 100%;
	margin: 0;
	padding: 0;
}

.secrecy {
	overflow:hidden;
	box-sizing:border-box;
	width: 100%;
    margin: 0;
	background-color:#fff;
	border: 2px solid #f00;
	border-radius: 4px;
    text-align: center;
}
.secrecy .box-title {
    font-size: 1.2em;
    background: #f00;
    padding: 2px 0 0;
    color: #fff;
    font-weight: bold;
}

.secrecyText {
    padding: 5px 0 3px;
    margin: 0;
	font-size: 16px;
    text-align: center !important;
}

.top_navBtn {
	margin:0.2em -1.5em 0 0;
}
.top_navBtn li {
    float: left;
    list-style: none;
	margin:0;
	padding: 0;
}
.top_navBtn li img {
	width:85px;
	margin:0 1.5em 0 0;
	border-radius: 15px;
}
.top_navBtn li img.gmail {
	width:81px;
	margin:0 1.5em 0 0;
	border:2px solid #ccc;
	border-radius: 15px;
}
.top_navBtn li a img:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
}

/*================================================
 *  点滅テキスト
 ================================================*/
#blinking {
	padding: 8px 0 20px;
	text-align:center;
}
#blinking span {
	display: block;
	margin:0;
	padding:0;
	font-size:26px;
	font-weight: bold;
	line-height: 0.9;
}
#blinking span img {
	height: 26px;
}

.blinking {
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}

/* フッター点滅テキスト */
#foot_blinking {
	padding: 5px 0 15px;
	text-align:center;
}
#foot_blinking span {
	display: block;
	margin:0;
	padding:0;
	font-size:24px;
	font-weight: bold;
	line-height: 0.9;
	color: #fff;
}
#foot_blinking span img {
	height: 24px;
}

@media screen and (max-width:979px) {
	#foot_blinking span {
		font-size:20px;
	}
	#foot_blinking span img {
		height: 20px;
	}
}

@media screen and (max-width:768px) {
	#foot_blinking span {
		font-size:18px;
	}
	#foot_blinking span img {
		height: 18px;
	}
}

@media screen and (max-width:500px) {
	#foot_blinking {
		padding: 0 0 10px;
	}
	#foot_blinking span {
		font-size:12px;
	}
	#foot_blinking span img {
		height: 12px;
	}
}

.foot_blinking {
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink {
    0% {opacity:0;}
    100% {opacity:1;}
}

/*================================================
 *  各種書類作成ボタン
 ================================================*/
#request_entry {
	margin-bottom: 20px;
	padding: 0;
	text-align:center;
}

/* ①源泉徴収票作成 */
.request-btn1 {
    display: block;
    position: relative;
	height:70px;
	margin-bottom: 0;
	padding: 20px 0 15px;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	border-radius: 5px;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffb5ca+0,ff91b0+54,ff91b0+54,ff6c96+55,ff4069+100 */
    background: rgb(255,181,202); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(255,181,202,1) 0%, rgba(255,145,176,1) 54%, rgba(255,145,176,1) 54%, rgba(255,108,150,1) 55%, rgba(255,64,105,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,181,202,1) 0%,rgba(255,145,176,1) 54%,rgba(255,145,176,1) 54%,rgba(255,108,150,1) 55%,rgba(255,64,105,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,181,202,1) 0%,rgba(255,145,176,1) 54%,rgba(255,145,176,1) 54%,rgba(255,108,150,1) 55%,rgba(255,64,105,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb5ca', endColorstr='#ff4069',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}
.request-btn1:hover {
    text-decoration: none;
    color: #fff;
    opacity: 0.7;
}
.request-btn1::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: request-btn1 3s ease-in-out infinite;
}
.request-btn1 span {
	margin:0;
	padding: 0;
	color: #fff;
	font-size: 12px;
}
@-webkit-keyframes request-btn1 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* ②給与明細作成 */
.request-btn2 {
    display: block;
    position: relative;
	height:70px;
	margin-bottom: 0;
	padding: 20px 0 15px;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	border-radius: 5px;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6db3f2+0,54a3ee+50,3690f0+51,1e69de+100;Blue+Gloss+%233 */
	background: #6db3f2; /* Old browsers */
	background: -moz-linear-gradient(top,  #6db3f2 0%, #54a3ee 54%, #3690f0 55%, #1e69de 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #6db3f2 0%,#54a3ee 54%,#3690f0 55%,#1e69de 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #6db3f2 0%,#54a3ee 54%,#3690f0 55%,#1e69de 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#1e69de',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}
.request-btn2:hover {
    text-decoration: none;
    color: #fff;
    opacity: 0.7;
}
.request-btn2::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: request-btn2 3s ease-in-out infinite;
}
.request-btn2 span {
	margin:0;
	padding: 0;
	color: #fff;
	font-size: 12px;
}
@-webkit-keyframes request-btn2 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* ③賞与明細作成 */
.request-btn3 {
    display: block;
    position: relative;
	height:70px;
	margin-bottom: 0;
	padding: 20px 0 15px;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	border-radius: 5px;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f9d884+0,fccd4d+50,f8b500+50,f8b500+100 */
	background: #f9d884; /* Old browsers */
	background: -moz-linear-gradient(top,  #f9d884 0%, #fccd4d 54%, #f8b500 55%, #f8b500 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #f9d884 0%,#fccd4d 54%,#f8b500 55%,#f8b500 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #f9d884 0%,#fccd4d 54%,#f8b500 55%,#f8b500 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9d884', endColorstr='#f8b500',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}
.request-btn3:hover {
    text-decoration: none;
    color: #fff;
    opacity: 0.7;
}
.request-btn3::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: request-btn3 3s ease-in-out infinite;
}
.request-btn3 span {
	margin:0;
	padding: 0;
	color: #fff;
	font-size: 12px;
}
@-webkit-keyframes request-btn3 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

.open {
    margin: 0 0 1em;
    padding: 0;
	font-size:22px;
	font-weight: bold;
	text-align:center;
}

@media screen and (max-width:979px) {
	.secrecy {
	    margin: 0 0 1em;
	}

	.top_entryBtn a span {
		font-size: 11px;
	}
}

@media screen and (max-width:768px) {
    .top_entry {
		box-sizing:border-box;
		width:100%;
        margin-bottom:2em;
        padding: 15px;
    }
	
    .phonenumber {
        font-size: 30px;
    }
    .phonenumber img {
        height: 18px;
    }

    .spnumber {
        font-size: 30px;
    }
    .spnumber img {
        height: 18px;
    }
	
    .top_navBtn li img {
        height:70px;
    }
	
    .open {
        margin-top: -1em;
    }
}

@media screen and (max-width:500px) {
    .phonenumber {
        line-height: 2.0;
    }

    .top_navBtn {
        margin-bottom: 1em;
    }
    .top_entryBtn a span {
        font-size: 12px;
    }

    .open {
        font-size:14px;
    }
}

@media screen and (max-width:320px) {
    .phonenumber {
        font-size: 28px;
    }
	
    .spnumber {
        font-size: 28px;
    }

    .top_navBtn li img {
        height:60px;
    }
	
    .top_entryBtn a span {
        font-size: 11px;
    }
}

/*================================================
 *  アップロード申し込み
 ================================================*/
#upload_entry {
	padding: 0;
	text-align:center;
}

/* 2カラム（スマートフォンでは1カラム) */
#upload_entry .twoCol {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	position:relative;
	overflow:hidden;
	margin-bottom:0;
}
#upload_entry .twoCol .inner {
	position: relative;
	overflow:hidden;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-direction: column-reverse;
	-webkit-box-direction: reverse;
	-webkit-flex-direction: column-reverse;
	flex-direction: column;
	width: 48%;
	width: calc((480 / 980) *100%);
	height: auto;
	margin:0;
}

#upload_entry .twoCol .inner > a {
	width: 100%;
	height: 100%;
}

@media screen and (max-width:767px) {
	#upload_entry .twoColl {
		display: block;
		margin-bottom: 20px;
	}
	#upload_entry .twoCol .inner {
		width : 100%;
		margin: 0 0 10px 0;
	}
}

/* ④ アップロード申し込みボタン　カメラ起動 */
.camera-upload-btn {
    display: block;
    position: relative;
	width: 70%;
	height:50px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 1em;
	padding: 20px 0 15px;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	border-radius: 6px;
    text-align:center;
	text-decoration: none;
	line-height: 1.4;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#999999+0,666666+50,444444+51,222222+100 */
	background: linear-gradient(to bottom,  #999999 0%,#666666 50%,#444444 51%,#222222 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    overflow: hidden;
}
.camera-upload-btn:hover {
    text-decoration: none;
    color: #fff;
    opacity: 0.7;
}
.camera-upload-btn::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: camera-upload-btn 3s ease-in-out infinite;
}
.camera-upload-btn span {
	display: block;
	margin:0;
	padding: 0;
	color: #fff;
	font-size: 12px;
	line-height: 2;
}

@-webkit-keyframes camera-upload-btn {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* ⑤ アップロード申し込みボタン */
.upload-btn {
    display: block;
    position: relative;
	width: 70%;
	height:50px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 1em;
	padding: 20px 0 15px;
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	border-radius: 6px;
    text-align:center;
	text-decoration: none;
	line-height: 1.4;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9dd53a+0,a1d54f+50,80c217+51,7cbc0a+100;Green+Gloss+%231 */
	background: linear-gradient(to bottom,  #9dd53a 0%,#a1d54f 54%,#80c217 55%,#7cbc0a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    overflow: hidden;
}
.upload-btn:hover {
    text-decoration: none;
    color: #fff;
    opacity: 0.7;
}
.upload-btn::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: upload-btn 3s ease-in-out infinite;
}
.upload-btn span {
	display: block;
	margin:0;
	padding: 0;
	color: #fff;
	font-size: 12px;
	line-height: 2;
}

@-webkit-keyframes upload-btn {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

@media screen and (max-width:979px) {
    .upload-btn {
		width: 100%;
    }
	
    .camera-upload-btn {
		width: 100%;
    }
}

@media screen and (max-width:767px) {
	#request_entry {
		margin-bottom: 0;
		padding: 0;
	}

    .camera-upload-btn {
		margin-bottom: 0;
		padding: 15px 0;
    }
}

@media screen and (max-width:500px) {
	#request_entry {
		margin-bottom: 0;
		padding: 0;
	}

    .camera-upload-btn {
		width: 100%;
		margin-bottom: 0;
		padding: 15px 0;
		line-height: 1.8;
    }
	.camera-upload-btn span {
	    display: block;
		margin:0;
		padding: 0;
		color: #fff;
		font-size: 12px;
		line-height: 1.8;
	}
	
	#upload_entry {
		padding: 0;
	}

    .upload-btn {
		width: 100%;
		margin-bottom: 0.5em;
		padding: 15px 0;
		line-height: 1.8;
    }
	.upload-btn span {
	    display: block;
		margin:0;
		padding: 0;
		color: #fff;
		font-size: 12px;
		line-height: 1.8;
	}
}

/*================================================
 *  ご注意ください！
 ================================================*/
.note {
	overflow:hidden;
	clear:both;
	position: relative;
	margin-bottom:0;
	padding: 20px;
	background-color:#fc0;
	border-radius:10px;
	border:5px solid #000;
}
.note img {
	float:left;
	max-width:120px;
	margin:0;
    vertical-align: middle;
}
.noteTitle {
	font-size:26px;
	font-weight: bold;
}
.note p {
	overflow:hidden;
	margin:0;
	padding:0;
	font-size:18px;
	font-weight: bold;
}

.noteImg {
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
}

.noteText {
	margin:0 0 0 140px;
}

@media screen and (max-width:768px) {
    .note img {
        max-width:60px;
        margin:0 1em 0 0;
    }
	
    .noteText {
        margin:0 0 0 80px;
    }
}

@media screen and (max-width:480px) {
    .note {
        padding: 15px;
    }
    .note img {
        max-width:40px;
        margin:0 1em 0 0;
    }
    .noteTitle {
        font-size:20px;
    }
    .note p {
        font-size:14px;
    }
	
    .noteText {
        margin:0 0 0 60px;
    }
}

/*================================================
 *  Twitter
 ================================================*/
#twitter {
	position: relative;
	overflow: hidden;
    box-sizing:border-box;
	width: 100%;
	margin:0 0 2em;
	padding: 20px;
	background:#fff;
	border-radius:5px;
}
#twitter h2 {
	margin-bottom: 1em;
}

.timeline {
	overflow: auto;
	height: 300px;
	margin: 0;
	padding: 1em 1.5em;
	border:1px solid #ccc;
}

@media screen and (max-width:767px) {
	#twitter {
		padding: 10px;
	}
	#twitter h2 {
		margin-bottom: 0.5em;
	}
}

/*================================================
 *  新着情報
 ================================================*/
#whatsNew {
	position: relative;
	overflow: hidden;
    box-sizing:border-box;
	width: 100%;
	margin:0 0 2em;
	padding: 20px;
	background:#fff;
	border-radius:5px;
}
#whatsNew h2 {
	margin-bottom: 1em;
}

.newsList {
	overflow: auto;
	height: 300px;
	margin: 0;
	padding: 1em 1.5em;
	border:1px solid #ccc;
}

.newsList dt {
	clear: both;
	float: left;
	margin: 0;
	padding: 10px 0;
	vertical-align: top;
	border-bottom: none;
}

.newsList dd {
	margin: 0;
	padding: 10px 0 10px 8em;
	vertical-align: top;
	border-bottom: 1px dotted #333;
}
.newsList dd p {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	margin: 0;
}

@media screen and (max-width:767px) {
	#whatsNew {
		padding: 10px;
	}
	#whatsNew h2 {
		margin-bottom: 0.5em;
	}

	.newsList {
		height: 200px;
		margin: 0;
		padding: 0.5em 1em;
		font-size:14px;
	}

	.newsList dt {
		float: none;
		margin: 0;
		padding: 10px 0 0 0;
		vertical-align: top;
		border-bottom: none;
	}

	.newsList dd {
		margin: 0;
		padding: 0 0 10px 0;
		vertical-align: top;
		border-bottom: 1px dotted #333;
	}
}

/*================================================
 *  サービス概要
 ================================================*/
.service {
	overflow:hidden;
	margin-bottom:1.5em;
}

.service h3 {
	margin-bottom:0.25em;
    padding: 0.5em 0.75em;
	font-size:18px;
	font-weight:bold;
    background-color: #f6f6f6;
    border-left: 8px solid #ff6c96;
}
.service h3 a {
    display:block;
	color:#ff6c96;
	text-decoration:none;
}
.service h3 a:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
.service h3.contact {
	font-size:16px;
	font-weight:bold;
	line-height: 1.2;
}
.service h3.contact span {
	font-size:14px;
}

/* --- アコーディオン --- */
.accordion {
    margin-bottom: 2em;
}
.acd-check {
    display: none;
}
.option {
    position: relative;
}
/* アコーディオンCLOSE */
.acd-label,
.acd-content {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0);
    transition: all 0.1s;
}
.acd-label {
	display: block;
	box-sizing:border-box;
	width: 100%;
	padding: 0.5em 0.75em;
	font-size:18px;
	color: #fff;
	background-color: #4682B4;
	border: solid 1px #fff;
}
/* プラマイ切り替え */
.acd-label::after,
.acd-label::before {
    content: "";
    position: absolute;
    right: 1em;
    top: 0.9em;
    width: 2px;
    height: 1em;
    background-color: #fff;
    transition: all 0.1s;
}
.acd-label::after {
    transform: rotate(90deg);
}
.acd-content {
    max-height: 0;
    overflow: hidden;
    background-color: #fff;
}
.acd-content p {
    margin: 0;
    padding: 0.5em;
    font-size: 14px;
    line-height: 1.5;
}
/* アコーディオンOPEN */
.acd-check:checked + .acd-label + .acd-content {
    max-height: 1200px;
    transition: all 1.5s;
}
.acd-check:checked + .acd-label::before {
    transform: rotate(90deg) !important;
}

.serviceInner {
	overflow:hidden;
	padding: 0 5px;
}

.area p {
	margin-left: 0.5em;
	line-height:1.8;
}

#howto .twoCol {
    margin-bottom: 0;
}

#howto .threeCol {
    margin-bottom: 0;
}

.howto {
	overflow:hidden;
	margin: 0;
	padding: 0;
	text-align:center;
}
.howto div {
    display:inline-block;
	overflow:hidden;
    box-sizing:border-box;
    width:100%;
    max-width:340px;
	margin: 0;
	padding: 15px 20px;
	font-size:18px;
	text-align:center;
	line-height:1.4;
	border:1px solid #ff6c96;
}
.howto div.last {
	margin-bottom:0.5em;
}
.howto table {
    box-sizing:border-box;
    width:100%;
    max-width:340px;
	margin: 1em auto;
	font-size:16px;
}

#price p {
	line-height:1.0;
}
#price p.bank {
	line-height:1.6;
}

p.arrow {
	margin: 0;
	padding: 0.5em 0 1em;
	border: none;
}

@media screen and (max-width:480px) {
	#howto h4 {
		font-size:18px;
	}
	#howto .twoCol .inner {
		width : 100%;
		margin: 0 0 10px 0;
	}
}

/*================================================
 *  各種サンプル例
 ================================================*/
.sample {
	overflow:hidden;
	margin:0;
	padding:0;
}

.sample_example {
	overflow:hidden;
	margin:0 0 2em;
	padding:0;
	border-bottom:1px dotted #999;
}

.sample_example h3 {
    display:block;
	margin-bottom:1em;
    padding: 0.5em 0.75em 0.4em;
	font-size:18px;
	font-weight:bold;
    background-color: #f6f6f6;
    border-left: 8px solid #7ecef4;
	line-height: 1.4;
}

.sampleImg {
	float:right;
	margin:0 0 1em 1em;
	padding:0;
}
.sampleImg img {
    box-sizing:border-box;
	width: 100%;
    border: 1px solid #ddd;
}
.sample_example p {
	padding:0 1em;
}

@media screen and (max-width:500px) {
    .sampleImg {
        float:none;
        margin:0 0 1em 0;
        padding:0;
    	text-align:center;
    }
	
    .sampleImg img {
		width: 150px;
    }
	
    .sample_example p {
        padding:0 0.5em;
    }
}

/*================================================
 *  検索されるワード一覧
 ================================================*/
.word {
	overflow: hidden;
	margin: 0;
	padding: 20px;
    border: 1px solid #ccc;
}
.word h3 {
    position: relative;
	margin-bottom:1em;
    padding: .25em 0 .25em .75em;
	font-size:20px;
	font-weight:bold;
    border-left: 6px solid #3498db;
}
.word h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 1px solid #999;
}
.word p {
	margin:0;
    padding:0;
}

@media screen and (max-width:480px) {
	.word h3 {
		font-size:18px;
	}
	.word {
		padding: 15px;
		font-size:11px;
	}
}

/*================================================
 *  会社概要
 ================================================*/
.company {
	overflow: hidden;
	margin: 0 0 2em;
	padding: 0;
}

.company table th {
	width: 35%;
}

/*================================================
 *  お申し込みフォーム
 ================================================*/
.entry {
	overflow: hidden;
	margin: 0 0 0.5em;
	padding: 0;
}

h3.entry {
    position: relative;
	margin-bottom:1em;
    padding: .25em 0 .25em .75em;
	font-size:20px;
	font-weight:bold;
	line-height: 1.4;
    border-left: 6px solid #3498db;
}
h3.entry::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 1px solid #ccc;
}
h3.entry span {
	font-size:14px;
}
h3.entry span.fee {
	font-size:14px;
	color:#f00;
}

table.entry_form {
	font-size: 16px;
	margin-bottom: 1em;
}
table.entry_form th {
	width: 40%;
}
table.entry_form td {
	vertical-align:middle;
}

table.under16 {
	overflow:hidden;
    width: 100%;
    box-sizing:border-box;
	font-size: 14px;
	margin-bottom: 0;
}
table.under16 th {
	width: 50%;
	background:#fff;
}

table.deduction {
	overflow:hidden;
    width: 100%;
    box-sizing:border-box;
	font-size: 14px;
	margin-bottom: 0;
}
table.deduction th {
	width: 50%;
	background:#fff;
}

table.number {
	overflow:hidden;
    width: 100%;
    box-sizing:border-box;
	font-size: 14px;
	margin-bottom: 0;
}
table.number th {
	width: 50%;
	background:#fff;
}

table.dependents {
	overflow:hidden;
    width: 100%;
    box-sizing:border-box;
	font-size: 14px;
	margin-bottom: 0;
}
table.dependents th {
	width: 50%;
	background:#fff;
}

table.amount_payment {
	overflow:hidden;
    width: 100%;
    box-sizing:border-box;
	margin-bottom: 0.5em;
	border:none;
}
table.amount_payment th {
	white-space: nowrap;
	padding:5px 0;
	background:none;
	border:none;
}
table.amount_payment td {

	padding:5px 0;
	background:none;
	border:none;
}

.form {
	margin:0;
	padding:0;
}
.form:last-child {
	margin-bottom:0;
}
.form ul {
	text-align:left;
}

/* ボタンリセット */
button,
input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
}
button,
input[type="reset"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
}
button,
input[type="button"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    border: none;
    outline: none;
    background: transparent;
}

input#submit_btn {
	display:inline-block;
	padding:15px 20px;
	font-size: 16px;
	font-weight: bold;
	color:#ff6c96;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #ff6c96;
	background:#fff;
	transition:all 0.2s ease 0s;
}
input#submit_btn:hover {
	font-weight: bold;
	color:#fff;
	background:#ff6c96;
	transition:all 0.2s ease 0s;
}

input#reset_btn {
	display:inline-block;
	padding:15px 20px;
	font-size: 16px;
	font-weight: bold;
	color:#ff6c96;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #ff6c96;
	background:#fff;
	transition:all 0.2s ease 0s;
}
input#reset_btn:hover {
	font-weight: bold;
	color:#fff;
	background:#ff6c96;
	transition:all 0.2s ease 0s;
}

input#back_btn {
	display:inline-block;
	padding:15px 20px;
	font-size: 16px;
	font-weight: bold;
	color:#ff6c96;
	text-decoration:none;
	border-radius:5px;
	border:1px solid #ff6c96;
	background:#fff;
	transition:all 0.2s ease 0s;
}
input#back_btn:hover {
	font-size: 16px;
	font-weight: bold;
	color:#fff;
	background:#ff6c96;
	transition:all 0.2s ease 0s;
}

input {
	padding: 0 8px;
    cursor: pointer;
    cursor: hand;
}

td input {
    height:30px;
}

select::-ms-expand {
	display: none;
}
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin-bottom: 0;
	padding: 8px 30px 8px 10px;
	font-size: 93%;
	line-height: 1.1em;
	border-radius: 5px;
	border: none;
	background-image: url(../img/icon_arrow.png);
	background-repeat: no-repeat;
	background-size: 12px 10px;
	background-position: right 10px center;
	background-color: #bddfff;
}

.salary {
	margin:0.5em 0;
}

.bonus {
	margin:0.5em 0;
}

input, select, textarea {
    font-size: 16px;
}

input[type="radio"],input[type="checkbox"]{
    position: relative;
    top: -2px;
	margin-right: -2px;
}

input, textarea::placeholder {
    font-size: 14px;
	line-height: 1.4em;
}

textarea {
	padding: 8px;
    cursor: pointer;
    cursor: hand;
}

/* --- フォーム部品のサイズ --- */
#saiyo-month,
#saiyo-day,
#kinzoku-years,
#kinzoku-months,
#others-months,
#others-days,
#working_days,
#working_hours,
#overtime_work {
    width: 10%;
}
#saiyo-year {
    width: 15%;
}

#koyouhoken_salary_amount01,
#koyouhoken_salary_amount02,
#koyouhoken_salary_amount03,
#koyouhoken_salary_amount04,
#koyouhoken_salary_amount05,
#koyouhoken_salary_amount06,
#koyouhoken_salary_amount07,
#koyouhoken_salary_amount08,
#koyouhoken_salary_amount09,
#koyouhoken_salary_amount10,
#koyouhoken_salary_amount11, 
#koyouhoken_salary_amount12 {
    width: 25%;
}

#salary-year01,
#salary-year02,
#salary-year03 {
    width: 15%;
}
#salary-month01-1,
#salary-month01-2,
#salary-month02-1,
#salary-month02-2,
#salary-month03-1,
#salary-month03-2 {
    width: 12%;
}
#salary-day01,
#salary-day02,
#salary-day03 {
    width: 12%;
}

#bonus-year01,
#bonus-year02,
#bonus-year03 {
    width: 15%;
}
#bonus-month01,
#bonus-month02,
#bonus-month03 {
    width: 12%;
}
#bonus-day01,
#bonus-day02,
#bonus-day03 {
    width: 12%;
}

#bonus_amount01,
#bonus_amount02,
#bonus_amount03 {
    width: 20%;
}

#relationship1-other,
#relationship2-other,
#relationship3-other,
#resident-tax {
    width: 25%;
}

#housing, #travel-costs, #various-allowances {
    width: 30%;
}

#name, #name2, #tel, #insurance-other, #total-amount {
    width: 50%;
}

#basic_salary01,
#basic_salary02,
#basic_salary03,
#yakushoku_teate01,
#yakushoku_teate02,
#yakushoku_teate03,
#zangyou_teate01,
#zangyou_teate02,
#zangyou_teate03,
#jutaku_teate01,
#jutaku_teate02,
#jutaku_teate03,
#tsukin_teate01,
#tsukin_teate02,
#tsukin_teate03,
#total01,
#total02,
#total03 {
    width: 40%;
}

#payment,
#company-name,
#company-tel,
#position,
#busho_yakushoku,
#insurance-other,
#deductible-spouse {
    width: 75%;
}

#deduction_others1,
#deduction_others2,
#deduction_others3,
#working_others1,
#working_others2,
#working_others3,
#working_others1-2,
#working_others2-2,
#working_others3-2 {
    width: 75%;
}

#add, #company-add, #citytown, #mail, #other-allowances {
    box-sizing: border-box;
    width: 100%;
}

/* --- （複数行のテキスト入力欄） --- */
#gensen_comment, #kyuyo_comment, #koyouhoken_comment, #shouyo_comment, #revise {
    box-sizing: border-box;
    width: 100%;
    height: 10em;
}

#advanced_setting01,
#advanced_setting02,
#advanced_setting03 {
    box-sizing: border-box;
    width: 100%;
    height: 5em;
	margin:0 0 0.5em;
}
#advanced_setting:last-child {
	margin:0;
}

.required {
	color: #d00;
}

.msg {
	margin:0 0 1em;
	color: #d00;
}

span.msg {
	color: #d00;
}

.entry_btn {
	text-align: center;
}

.reference {
    display:block;
	margin-top: 0;
	font-size:14px;
	line-height: 1.4em;
	color: #d00;
}

.details {
	font-size:14px;
	color: #666;
}

.noteMt {
    display:block;
	margin: 0.5em 0 0;
	font-size:14px;
	line-height: 1.4em;
	color: #d00;
}
.noteMtb {
    display:block;
	margin: 0.5em 0;
	font-size:14px;
	line-height: 1.4em;
	color: #d00;
}
.noteMb {
    display:block;
	margin: 0 0 0.5em;
	font-size:14px;
	line-height: 1.4em;
	color: #d00;
}

.umu {
	font-size:14px;
	line-height: 1.4em;
	color: #d00;
}

.komeNote {
	font-size:14px;
	color: #d00;
}

.hosoku {
    display:block;
	margin:0 0 0.5em;
	font-size:14px;
	line-height: 1.4em;
	color: #d00;
}

.contactMethod {
    margin: 0;
    color:#d00;
}

.border-bottom {
    border-bottom:double;
    border-color:#d00;
    border-width:3px;
}

textarea{
    display:block;
}

.holidayPayday {
	margin: 0.5em 0 0;
	padding: 0;
}

.keitai-other {
	margin: 0.5em 0 0;
	padding: 0;
}

.insurance-other {
	margin: 0.5em 0 0;
	padding: 0;
}

.example {
    display:block;
	margin: 0;
	padding: 0;
	font-size:14px;
    color: #888;
}

th.understand {
	padding: 10px 0;
}
.understand {
	text-align: center;
	background:#fff0f5;
}

th.payment_details {
	padding: 10px 0;
}
.payment_details {
	font-size:20px;
	font-weight:bold;
	text-align: center;
	background:#fff;
}

/* デフォルトでは非表示 */
.error {
    display: none;
}
/* 隣接セレクタで
 * input:invalidの隣の
 * エラーメッセージは表示する
 */
input:invalid + .error {
    font-size: 0.9em;
    display: block;
    color: #d00;
}

/* 書類をアップロード */
input[type="file"] {
    display: none;
}

/* ファイル選択 */
.attachment {
	margin: 0 0 0.75em;
	padding: 0;
}
.attachment:last-child {
	margin: 0;
	padding: 0;
}
.attachment label {
	display: inline-block;
	position: relative;
	padding: 10px 15px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
	background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	font-size: 16px;
	border:1px solid #888;
	border-radius: 4px;
	transition: all 0.3s;
    cursor: pointer;
}
.attachment label:hover {
	background: #888;
	color:#fff;
	border:1px solid #888;
	transition: all 0.4s;
}
.attachment label input {
	position: absolute;
	left:0;
	top:0;
	opacity: 0;
	width: 100%;
	height: 100%;
}
.attachment .filename {
	font-weight: 16px;
	margin:0 0 0 5px;
}

/* 写真を撮影してアップロード */
.camera {
	margin: 0 0 0.75em;
	padding: 0;
}
.camera:last-child {
	margin: 0;
	padding: 0;
}
.camera label {
    display: block;
	box-sizing: border-box;
    width: 100%;
    max-width: 350px;
    margin: 0;
	padding: 10px 15px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100;White+3D */
	background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	font-size: 16px;
	text-align: center;
	border:1px solid #888;
	border-radius: 4px;
	transition: all 0.3s;
    cursor: pointer;
}
.camera label:hover {
	background: #888;
	color:#fff;
	border:1px solid #888;
	transition: all 0.4s;
}
.camera label input {
    display: none;
}

.upload-kome{
	font-size: 14px;
	color:#d00;
	text-align: center;
}

@media screen and (max-width:768px) {
    table.entry_form th {
        width: 40%;
    }
	
    #koyouhoken_salary_amount01,
    #koyouhoken_salary_amount02,
    #koyouhoken_salary_amount03,
    #koyouhoken_salary_amount04,
    #koyouhoken_salary_amount05,
    #koyouhoken_salary_amount06,
    #koyouhoken_salary_amount07,
    #koyouhoken_salary_amount08,
    #koyouhoken_salary_amount09,
    #koyouhoken_salary_amount10,
    #koyouhoken_salary_amount11, 
    #koyouhoken_salary_amount12 {
        width: 70%;
    }
	
    #salary_amount01,
    #salary_amount02,
    #salary_amount03,
    #salary_amount04,
    #salary_amount05,
    #salary_amount06,
    #salary_amount07,
    #salary_amount08,
    #salary_amount09,
    #salary_amount10,
    #salary_amount11, 
    #salary_amount12 {
        width: 70%;
    }

    #bonus_amount01,
    #bonus_amount02,
    #bonus_amount03 {
        width: 70%;
    }
}

@media screen and (max-width:480px) {
    h3.entry span {
        font-size:12px;
    }
    h3.entry span.fee {
        font-size:12px;
    }

    .company table th {
        width: 100%;
    }

	#basic_salary01,
	#basic_salary02,
	#basic_salary03,
	#yakushoku_teate01,
	#yakushoku_teate02,
	#yakushoku_teate03,
	#zangyou_teate01,
	#zangyou_teate02,
	#zangyou_teate03,
	#jutaku_teate01,
	#jutaku_teate02,
	#jutaku_teate03,
	#tsukin_teate01,
	#tsukin_teate02,
	#tsukin_teate03,
	#total01,
	#total02,
	#total03 {
	    width: 50%;
	}

    #name, #name2, #tel,
	#company-name,
	#company-tel,
	#position,
	#busho_yakushoku,
	#insurance-other,
	#koyouhoken,
	#dependents-kyuyo,
	#deductible-spouse {
        box-sizing: border-box;
        width: 100%;
    }

	#payment {
        width: 82%;
    }

	#deduction_others1,
	#deduction_others2,
	#deduction_others3 {
	    box-sizing: border-box;
	    width: 100%;
	}

	#teate_others1,
	#teate_others2,
	#teate_others3,
	#teate_others4,
	#teate_others5,
	#teate_others6,
	#teate_others1-2,
	#teate_others2-2,
	#teate_others3-2,
	#teate_others4-2,
	#teate_others5-2,
	#teate_others6-2 {
        box-sizing: border-box;
        width: 100%;
    }

	#working_others1,
	#working_others2,
	#working_others3,
	#working_others1-2,
	#working_others2-2,
	#working_others3-2 {
        box-sizing: border-box;
        width: 100%;
    }
	
    table.entry_form th {
        width: 100%;
    }
	
    #koyouhoken_salary_amount01,
    #koyouhoken_salary_amount02,
    #koyouhoken_salary_amount03,
    #koyouhoken_salary_amount04,
    #koyouhoken_salary_amount05,
    #koyouhoken_salary_amount06,
    #koyouhoken_salary_amount07,
    #koyouhoken_salary_amount08,
    #koyouhoken_salary_amount09,
    #koyouhoken_salary_amount10,
    #koyouhoken_salary_amount11, 
    #koyouhoken_salary_amount12 {
        width: 60%;
    }
	
	#salary-year01,
	#salary-year02,
	#salary-year03 {
	    width: 20%;
	}
	#salary-month01-1,
	#salary-month01-2,
	#salary-month02-1,
	#salary-month02-2,
	#salary-month03-1,
	#salary-month03-2 {
	    width: 15%;
	}
	#salary-day01,
	#salary-day02,
	#salary-day03 {
	    width: 15%;
	}
	
	#bonus-year01,
	#bonus-year02,
	#bonus-year03 {
	    width: 20%;
	}
	#bonus-month01,
	#bonus-month02,
	#bonus-month03 {
	    width: 15%;
	}
	#bonus-day01,
	#bonus-day02,
	#bonus-day03 {
	    width: 15%;
	}
	
    #salary_amount01,
    #salary_amount02,
    #salary_amount03,
    #salary_amount04,
    #salary_amount05,
    #salary_amount06,
    #salary_amount07,
    #salary_amount08,
    #salary_amount09,
    #salary_amount10,
    #salary_amount11, 
    #salary_amount12 {
        width: 60%;
    }

	#salary-year01,
	#salary-year02,
	#salary-year03 {
	    width: 25%;
	}
	#salary-month01,
	#salary-month02,
	#salary-month03 {
	    width: 20%;
	}
	#salary-day01,
	#salary-day02,
	#salary-day03 {
	    width: 20%;
	}

    #salary_amount01,
    #salary_amount02,
    #salary_amount03 {
        width: 30%;
    }

	#bonus-year01,
	#bonus-year02,
	#bonus-year03 {
	    width: 25%;
	}
	#bonus-month01,
	#bonus-month02,
	#bonus-month03 {
	    width: 20%;
	}
	#bonus-day01,
	#bonus-day02,
	#bonus-day03 {
	    width: 20%;
	}

    #bonus_amount01,
    #bonus_amount02,
    #bonus_amount03 {
        width: 30%;
    }
	
    td.salary {
        font-size: 14px;
    }
	
    th.understand span.kome {
        font-size: 13px;
    }
	
    .payTime {
        margin:0 0 0.5em;
    }
	
    .noteMt {
        font-size:13px;
    }
    .noteMtb {
        font-size:13px;
    }
    .noteMb {
        font-size:13px;
    }

    .umu {
        font-size:13px;
    }

    .hosoku {
        font-size:13px;
    }
}

/*================================================
 *  プライバシーポリシー
 ================================================*/
.policy {
	overflow: hidden;
	margin: 0;
	padding: 30px;
    border: 1px solid #ddd;
}

.policy h3 {
    position: relative;
	margin-bottom:1em;
    padding: .25em 0 .25em .75em;
	font-size:20px;
	font-weight:bold;
    border-left: 6px solid #3498db;
}
.policy h3::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 1px solid #ccc;
}

.strong {
	margin-bottom: 0.5em;
    padding: 0;
	font-size:18px;
	font-weight:bold;
}

.policy ol {
	margin:0;
}

/*================================================
 *  源泉徴収票の作成について
 ================================================*/
.withholding {
	overflow: hidden;
	margin: 0 0 1.5em;
	padding: 0;
}
.withholding h3 {
	margin-bottom:1.25em;
    padding: 0.5em 0.75em;
	font-size:20px;
	color:#fff;
    background-color: #62a6cb;
	border-radius:6px;
}
.withholding h4 {
	margin: 0 0 0.75em;
    position: relative;
    padding: 0.25em 0 0.25em 0.75em;
    font-size:18px;
	font-weight:bold;
	color:#333;
    background-color: #fff;
    border-left: 6px solid #2077b7;
	border-radius:0;
}
.withholding h4::after {
    position: absolute;
    left: 0;
    bottom: 0;
    content: '';
    width: 100%;
    height: 0;
    border-bottom: 1px solid #ccc;
}
.withholding p {
	overflow: hidden;
	margin: 0 0 2em;
	padding: 0;
}
.withholding span {
	font-size:12px;
}

.withholding .imgR img {
    width:100%;
    max-width:250px;
}

.withholdingImg {
	overflow: hidden;
	margin: 0 0 2em;
	padding: 0;
}

.withholding table {
    box-sizing:border-box;
    width:100%;
	margin-bottom:1.5em;
	border-collapse:collapse;
	border:1px solid #ccc;
	background:#fff;
}
.withholding table th {
	padding:10px;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
	border:1px solid #ccc;
	background:#eee;
}
.withholding table td {
	padding:10px;
	text-align:left;
	border:1px solid #ccc;
}
.withholding table td.rightJustified {
	text-align:right;
}

/*================================================
 *  グローバルナビゲーション
 ================================================*/
/* PC用 */
@media print, screen and (min-width:960px) {
	nav.gnav:after {
		content: '';
		display: block;
		clear: both;
	}
	nav.gnav {
		display: block !important;
		float: right;
	}

	/* 共通 */
	nav.gnav ul {
		margin: 0;
		padding: 0;
	}
	nav.gnav ul li {
		position: relative;
		line-height: 60px;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	nav.gnav ul li a {
		display: block;
		background: #fff;
		color: #333;
		font-size: 14px;
		font-weight: bold;
		text-decoration: none;
	}
	nav.gnav ul li:hover > a {
		color: #fff;
		background: #0082b4;
	}
	
	nav li+li:before {
        position: absolute;
        display: block;
        content: "";
        top: 50%;
        height: 30px;
        margin-top: -15px;
        border-right: 0 solid #ccc;
    }

	/* 1段目 */
	nav.gnav > ul > li {
		position: relative;
		float: left;
		margin: 0;
		padding: 0;
		text-align: center;
		list-style: none;
		line-height: 60px;
	}
	nav.gnav > ul > li:nth-child(1) {
		width: 75px;
	}
	nav.gnav > ul > li:nth-child(2) {
		width: 120px;
	}
	nav.gnav > ul > li:nth-child(3) {
		width: 130px;
	}
	nav.gnav > ul > li:nth-child(4) {
		width: 130px;
	}
	nav.gnav > ul > li:nth-child(5) {
		width: 90px;
	}
	nav.gnav > ul > li:nth-child(6) {
		width: 100px;
	}
	
	nav.gnav > ul > li.subnav a {
		padding-right: 20px;
	}
	nav.gnav > ul > li.subnav > a:after {
		position: absolute;
		content: "";
		top: 50%;
		width: 0;
		height: 0;
		margin-top: -2.5px;
		margin-left: 10px;
		border: 5px solid transparent;
		border-top-color: #ccc;
	}

	/* 2段目 */
	nav.gnav ul li ul {
		position: absolute;
		z-index: 3;
		top: 100%;
		left: 0;
		width: 210px;
		margin: 0;
		padding: 0;
	}
	nav.gnav ul li ul li {
		overflow: hidden;
		height: 0;
		color: #fff;
		transition: .2s;
	}
	nav.gnav ul li ul li a {
		padding: 0 15px;
		text-align: center;
		color: #fff;
		background: #006099;
		font-weight: normal;
	}
	nav.gnav ul li ul li a:hover {
		background: #00427a;
	}
	nav.gnav ul li:hover > ul > li {
		overflow: visible;
		height: 40px;
		line-height: 40px;
		border-bottom: 1px solid #4ca7ca;
	}
	nav.gnav ul li:hover ul li:last-child {
		border-bottom: none;
	}
	nav.gnav > ul > li:last-child > ul {
		left: -110px;
	}

	#spMenu {
		display: none;
	}
}

/* タブレット・スマートフォン用 */
@media screen and (max-width:959px) {
	nav.gnav {
		display: none;
	}
	nav.gnav ul {
		margin: 0;
		padding: 0;
	}
	nav.gnav > ul {
		z-index: 2;
		overflow: auto;
		position: fixed;
		top: 55px;
		right: 0;
		width: 100%;
		height: 88%;
		height: -webkit-calc(100% - 50px);
		height: calc(100% - 50px);
	}
	nav.gnav li {
		position: relative;
		width: 100%;
		float: none;
		margin: 0;
		text-align: left;
		list-style: none;
		border-bottom: 1px solid #4ca7ca;
		background: #0082b4;
	}
	nav.gnav li:first-child {
		border-top: 0;
	}
	nav.gnav li:last-child {
		border-bottom: 0;
	}
	nav.gnav li a {
		display: block;
		padding: 10px 20px;
		color: #fff;
		text-decoration: none;
		background: #0082b4;
	}
	nav.gnav li a:hover {
		color: #fff;
		background: #006099;
	}
	nav.gnav ul ul {
		display: none;
		position: relative;
	}
	nav.gnav li li a {
		box-sizing: border-box;
		width: 100%;
		padding: 10px 30px 10px 34px;
		text-align: left;
	}
	nav.gnav li li li a {
		padding: 10px 20px 10px 48px;
	}

	nav.gnav .subnav > a:before {
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 20px;
		right: 20px;
		width: 10px;
		height: 10px;
		margin-top: -5px;
		background: #f1f1f1;
	}
	nav.gnav .subnav > a:after {
		display: block;
		content: "";
		position: absolute;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		top: 20px;
		right: 20px;
		width: 10px;
		height: 10px;
		margin-top: -10px;
		background: #0082b4;
	}
	nav.gnav .subnav a:hover:after {
		background: #006099;
	}
	nav.gnav .subnav.active > a:before {
		margin-top: 0;
	}
	nav.gnav .subnav.active > a:after {
		margin-top: 5px;
	}

	.spMenuWrap {
		display: block;
		position: fixed;
		top: 0;
		right: 0;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
		background: transparent;
	}

	#spMenu {
		position: absolute;
		top: 15px;
		right: 10px;
	}

	#spMenu:hover {
		cursor: pointer;
	}

	#navBtn {
		display: inline-block;
		position: relative;
		width: 30px;
		height: 30px;
		border-radius: 5%;
		background: #333;
	}
	#navBtnIcon {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		width: 14px;
		height: 2px;
		margin: -1px 0 0 -7px;
		background: #f1f1f1;
		transition: .2s;
	}
	#navBtnIcon:before,
	#navBtnIcon:after {
		display: block;
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		width: 14px;
		height: 2px;
		background: #f1f1f1;
		transition: 0.3s;
	}
	#navBtnIcon:before {
		margin-top: -6px;
	}
	#navBtnIcon:after {
		margin-top: 4px;
	}
	#navBtn .close {
		background: transparent;
	}
	#navBtn .close:before,
	#navBtn .close:after {
		margin-top: 0;
	}
	#navBtn .close:before {
		transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}
	#navBtn .close:after {
		transform: rotate(-135deg);
		-webkit-transform: rotate(-135deg);
	}
}

/*================================================
 *  フッター
 ================================================*/
footer {
	clear: both;
}

#footMenu ul li {
    list-style: none;
    margin: 0;
    padding: 0;
}

#footMenu {
    position: relative;
    font-size:12px;
    background: #ddd;
}

#footMenu .footmenu a {
    display: block;
    padding: 0 10px;
    color:#333;
}

@media screen and (min-width:960px) { 
    #footMenu .footmenu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 20px 0 10px;
    }
    #footMenu .footmenu a:hover {
        color: #ca353b;
    }
	
    .copyright {
        overflow: hidden;
        width: 100%;
        padding:15px 0;
        font-size:11px;
        text-align:center;
        color:#efede9;
        background:#2e2e2e;
    }
}

@media only screen and (max-width: 959px) {
    #footMenu {
        text-align: center;
        margin-bottom:110px; /* フッターメニュー下マージン調整 */
    }

    #footMenu .footmenu li {
        border-bottom: 1px dotted #999;
    }

    #footMenu .footmenu li:last-child {
        border-bottom: 0;
    }

    #footMenu .footmenu li a {
        padding: 8px 15px;
		color:#333;
        text-align: left;
    }
    #footMenu .footmenu a:hover {
        color: #ca353b;
    }
	
    .copyright {
        overflow: hidden;
        width: 100%;
        padding:8px 0;
        font-size:11px;
        text-align:center;
        color:#efede9;
        background:#2e2e2e;
    }
}

/*================================================
 *  フッター固定ボタン
 ================================================*/
.footEntry {
	position: fixed;
    left: 0;
    bottom: 0;
	box-sizing: border-box;
    width: 100%;
}

.footEntryInner {
	box-sizing: border-box;
	width:100%;
	overflow:hidden;
	margin-bottom:0;
	padding: 10px;
	background:#000;
}

.footEntryBtnBox {
	overflow:hidden;
	margin:0 0 0.5em;
}

.footEntryBtnBox ul {
	overflow:hidden;
	margin:0 -1.492% 0 0;
}
.footEntryBtnBox li {
	list-style:none;
	float:left;
	width:31.840%;
	margin:0 1.492% 0 0;
}
.footEntryBtnBox li:nth-child(3n+1) {
	clear:both;
}
.footEntryBtnBox p {
	margin: 0;
	padding: 0;
}

/* ① 源泉徴収票作成 */
.foot_request-btn1 {
    display: block;
    position: relative;
	margin-bottom:0;
	padding: 10px 0 8px;
	border-radius: 5px;
	font-size:14px;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	color:#fff;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffb5ca+0,ff91b0+54,ff91b0+54,ff6c96+55,ff4069+100 */
    background: rgb(255,181,202); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(255,181,202,1) 0%, rgba(255,145,176,1) 54%, rgba(255,145,176,1) 54%, rgba(255,108,150,1) 55%, rgba(255,64,105,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(255,181,202,1) 0%,rgba(255,145,176,1) 54%,rgba(255,145,176,1) 54%,rgba(255,108,150,1) 55%,rgba(255,64,105,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(255,181,202,1) 0%,rgba(255,145,176,1) 54%,rgba(255,145,176,1) 54%,rgba(255,108,150,1) 55%,rgba(255,64,105,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb5ca', endColorstr='#ff4069',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}
.foot_request-btn1:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
}
.foot_request-btn1::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -40px;
    left: 0;
    width: 20px;
    height: 100%;
    background-color: #fff;
    animation: request-btn1 3s ease-in-out infinite;
}

@-webkit-keyframes foot_request-btn1 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* ② 給与明細作成 */
.foot_request-btn2 {
    display: block;
    position: relative;
	margin-bottom:0;
	padding: 10px 0 8px;
	border-radius: 5px;
	font-size:14px;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	color:#fff;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6db3f2+0,54a3ee+50,3690f0+51,1e69de+100;Blue+Gloss+%233 */
	background: #6db3f2; /* Old browsers */
	background: -moz-linear-gradient(top,  #6db3f2 0%, #54a3ee 54%, #3690f0 55%, #1e69de 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #6db3f2 0%,#54a3ee 54%,#3690f0 55%,#1e69de 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #6db3f2 0%,#54a3ee 54%,#3690f0 55%,#1e69de 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#1e69de',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}
.foot_request-btn2:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
}
.foot_request-btn2::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -40px;
    left: 0;
    width: 20px;
    height: 100%;
    background-color: #fff;
    animation: request-btn2 3s ease-in-out infinite;
}

@-webkit-keyframes foot_request-btn2 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* ③ 賞与明細作成 */
.foot_request-btn3 {
    display: block;
    position: relative;
	margin-bottom:0;
	padding: 10px 0 8px;
	border-radius: 5px;
	font-size:14px;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	color:#fff;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+50,f8b500+100 */
	background: #fceabb; /* Old browsers */
	background: -moz-linear-gradient(top,  #fceabb 0%, #fccd4d 54%, #f8b500 55%, #f8b500 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #fceabb 0%,#fccd4d 54%,#f8b500 55%,#f8b500 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 54%,#f8b500 55%,#f8b500 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#f8b500',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}
.foot_request-btn3:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
}
.foot_request-btn3::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -40px;
    left: 0;
    width: 20px;
    height: 100%;
    background-color: #fff;
    animation: request-btn3 3s ease-in-out infinite;
}

@-webkit-keyframes foot_request-btn3 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* アップロード申し込み */
#foot-upload_entry {
	padding: 0;
	text-align:center;
}

#foot-upload_entry .twoCol {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	position:relative;
	overflow:hidden;
	margin-bottom:0;
}
#foot-upload_entry .twoCol .inner {
	position: relative;
	overflow:hidden;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
	-ms-flex-pack: justify;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-ms-flex-direction: column-reverse;
	-webkit-box-direction: reverse;
	-webkit-flex-direction: column-reverse;
	flex-direction: column;
	width: 48%;
	width: calc((480 / 980) *100%);
	height: auto;
	margin:0;
}

/* ④ カメラ起動｜アップロード申し込みボタン */
.foot-camera_upload-btn {
    display: block;
    position: relative;
	margin-bottom:0;
	padding: 10px 0 8px;
	border-radius: 5px;
	font-size:14px;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	color:#fff;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#999999+0,666666+50,444444+51,222222+100 */
	background: linear-gradient(to bottom,  #999999 0%,#666666 50%,#444444 51%,#222222 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    overflow: hidden;
}
.foot-camera_upload-btn:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
}
.foot-camera_upload-btn::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -40px;
    left: 0;
    width: 20px;
    height: 100%;
    background-color: #fff;
    animation: foot-camera_upload-btn 3s ease-in-out infinite;
}

@-webkit-keyframes foot-camera_upload-btn {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* ⑤ アップロード申し込みボタン */
.foot-upload-btn {
    display: block;
    position: relative;
	margin-bottom:0;
	padding: 10px 0 8px;
	border-radius: 5px;
	font-size:14px;
	text-shadow:
     2px  2px 2px #555,
     2px  0px 2px #555,
     0px  2px 2px #555,
    -1px -1px 0px #888,
    -1px -0px 0px #888,
    -0px -1px 0px #888;
	color:#fff;
    text-align:center;
	text-decoration: none;
	line-height: 1.2;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#9dd53a+0,a1d54f+50,80c217+51,7cbc0a+100;Green+Gloss+%231 */
	background: linear-gradient(to bottom,  #9dd53a 0%,#a1d54f 54%,#80c217 55%,#7cbc0a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    overflow: hidden;
}
.foot-upload-btn:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
	-ms-filter:"alpha( opacity=60 )";
}
.foot-upload-btn::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -40px;
    left: 0;
    width: 20px;
    height: 100%;
    background-color: #fff;
    animation: foot-upload-btn 3s ease-in-out infinite;
}

@-webkit-keyframes foot-upload-btn {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

@media screen and (max-width:500px) {
	.foot_request-btn1 {
		font-size:11px;
	}
	.foot_request-btn2 {
		font-size:11px;
	}
	.foot_request-btn3 {
		font-size:11px;
	}
	
	.foot-camera_upload-btn {
		font-size:11px;
	}
	.foot-upload-btn {
		font-size:11px;
	}
}

/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
	z-index: 100;
	position:fixed;
	bottom:10px;
	right:10px;
}
.totop a {
	display:block;
	text-decoration:none;
}
.totop img {
    width: 45px;
	background:#36c;
}
.totop img:hover {
	background:#039;
}

@media screen and (max-width:768px) {
    .totop {
        bottom:120px;
    }
}

/*================================================
 *  スライドショー
 ================================================*/
.slide {
	margin-bottom: 50px;
	padding-top: 0;
	overflow: hidden;
	position: relative;
}
.slideInner {
	list-style: none;
	margin: 0;
	padding: 0;
}
.slideInner li {
	position: absolute;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: #fff;
	background-position: 50% 0;
	background-repeat: no-repeat;
}

/*================================================
 *  タブレット・スマートフォン
 ================================================*/
/* テンプレートより小さくなった場合に適用 */
@media screen and (max-width:979px) {
	.headerInner {
		width: 100%;
        padding: 0;
	}

	.inner {
		width: 100%;
	}
	
    .slide {
		margin-bottom: 25px;
        padding-top: 0;
    }

	#contents {
		box-sizing: border-box;
		width: 100%;
		padding: 0 10px;
	}
	
	#main {
		position: relative;
		margin-top: -10px;
	}

	footer {
		width: 100%;
	}

	.lock {
		position: fixed;
		z-index: -1;
		width: 100%;
		height: 100%;
		top: 0;
		right: 0;
	}
}

@media screen and (max-width:767px) {
    .serviceInner {
		box-sizing:border-box;
		width:100%;
    }
	
    .policy {
        padding: 15px;
    }
}

@media screen and (min-width: 768px) {
	a[href^="tel:"] {
		pointer-events: none;
        text-decoration:none;
	}
}

@media screen and (max-width:480px) {
	article {
		padding:20px 10px;
	}
	
	#main {
		position: relative;
		box-sizing: border-box;
		width: 100%;
		margin-top: 30px;
		padding: 10px;
	}

    .slide {
		margin-bottom: 20px;
        padding-top: 15px;
    }

    strong {
        font-size:18px;
    }

    .table_sp { margin: 0 0 20px; }
    .table_sp th,
    .table_sp td{
        width: auto;
        display: block;
        border: none;
    }
    .table_sp th {border-top: 1px #ccc solid; border-bottom: 0;}
    .table_sp td {border-top: 1px #ccc solid; border-bottom: 0;}
    .table_sp tr:first-child th {border-top: none;}

    table.under16 {
        border: none;
    }

    td.under16td {
        padding:0;
    }
	
    table.deduction {
        border: none;
    }

    td.deduction_td {
        padding:0;
    }
	
    table.number {
        border: none;
    }

    td.number_td {
        padding:0;
    }
	
    table.dependents {
        border: none;
    }

    td.dependents_td {
        padding:0;
    }

    td.amount_payment_td {
        padding:0;
    }

    td.deduction_amount_td {
        padding:0;
    }
}

@media screen and (min-width: 500px){
    .br-sp {display: none; }
}


