@charset "UTF-8";

* {
	margin: 0px;
	padding: 0px;
	}

html {
	font-size: 62.5%;
	height: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    scroll-behavior: smooth;
}

body {font-size: 10px; font-size: 1.0rem;}


body {
    color: #161616;
	text-align: center;
	font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
	font-family: 'Noto Sans JP', sans-serif !important;
	/* 長いURL改行対策 */
	word-break: break-all;
    background-color: #fff8c6;
	}

/* 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: #1da2db;
	text-decoration: underline;
	}

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

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

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


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


/* bg_color
-----------------------------------------------------------  */
.bg_blue 								{ background: #02398a; color: #fff;}
.bg_gray 								{ background-color: #efefef;}



/* ft_color
-----------------------------------------------------------  */
.ft_color 								{ color: #2cc28a;}
.ft_color_white 						{ color: #fff;}
.ft_color02 							{ color: #ee7d18;}



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


/* text-indent
----------------------------------------------------------- */
.icon_cateall
										{ overflow: hidden; text-indent: 100%; white-space: nowrap;}

/* text-align
----------------------------------------------------------- */
.content { 
    padding: 0 0 20px;
    background-color: #f1f1ea;
    text-align: center;
}
.step-li{
    justify-content: space-between;
    flex-wrap: wrap;
}
.step-li li{
    width: 28%;
    box-sizing:border-box;
    padding: 5% 2% 2%;
    background: #fff;
    border-radius:8px;
    margin: 0 auto;
    position: relative;
    margin: 4% auto 2%;
}

.step-li p{
    text-align: center;
    line-height: 1.2em;
    padding-bottom: 5%;
    height: 24%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step_num{
    position: absolute;
    top: 0%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

.step-img img {
    width: 74%;
    margin: 0 auto 0.8rem;
}

.mail_box {
    width: 600px;
    margin: auto;
    padding: 5px 40px;
    border-radius: 3px;
    text-align: center;
}

.mail_box p { 
    font-weight: bold;
    margin-bottom: 0.3em;
}

.txt_box  {
    position: relative;
}

.mail_box input[type="email"] {
    width: 400px;
    line-height: 1.5rem;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-shadow: none;
    background-color: #fff;
    text-align: left;
    margin: 20px 0;
    border: none;
}

.content .info { font-weight: bold;}

.campaign_info {font-size: 1.2rem;}

.campaign_info ul {
    padding-left: 30px;
    margin: 15px 0;
}

.campaign_info li {list-style: disc;}
.footer	p.copy small { font-style: normal; text-align: center; padding: 2rem 0;}
.btn_box {
    text-align: center;
	margin-top: 20px;
}

.btn_box .auxiliary {
    font-size: 1.2rem;
    color: #1da2db;
    margin-bottom: 5px;
}

.btn1 {
    transition: all 0.3s 0s ease;
    color: #fff;
    pointer-events: auto;
    cursor: pointer;
    border: none;
    text-align: center;
    margin: 0 auto;
    position: relative;
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    width: 84%;
    background: #f39800;
    border-radius: 4px;
    height: 54px;
}

.btn1::after {
    content: "";
    display: block;
    position: absolute;
    top: 49%;
    right: 18px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg) translateY(-50%);
}
.btn1:hover{
	opacity:0.7;
}

.btn_bg_yellow {background: #fede27!important; color: #02398a!important;}
.btn_bg_yellow::after{
    border-top: 2px solid #02398a!important;
    border-right: 2px solid #02398a!important;
}

.sp-only {display: none;}

.mv_illust.fin {
    height: 170px;
}

.mv_illust {
    font-family: "corporate-logo-ver2", sans-serif;
    font-weight: 700;
    font-style: normal;
    padding-bottom: 1%;
    background-color: #fff;
    margin-bottom: 50px;
    width: 50%;
    border-radius: 8px;
    padding: 20px 30px;
    position: relative;
}
.mv_illust .man,
.mv_illust .woman{
    width: 100%;
    max-width: 180px;
    position: absolute;
    bottom: -26%;
}
.mv_illust .man{
    left: -11%;
}
.mv_illust .woman{
    right: -11%;
}

.mv_illust h1{
    font-weight: 600;
    line-height: 1.3em;
    font-size: 2.2em;
}
.mv_illust .ttl{
    color: #fff;
    border-radius: 3px;
    font-weight: 600;
    padding: 5px 8px;
    margin: 0 3px 15px;
    white-space: nowrap;
    display: inline-block;
}
.mv_illust .ttl.green{
    background: #22ac38;
}
.mv_illust .ttl.orange{
    background: #f39800;
}
.orange span{
    font-weight: bold;
    background: linear-gradient(transparent 70%, #fffa7d 70%);
    padding: .3rem 0 .3rem .3rem;
}

.campaign_list_title {
    font-size: 2.5rem;
    font-weight: bold;
    text-align: center;
}

ul.campaign_list {
    text-align: left;
    margin-top: 50px;
}

.checkborder {
    filter: drop-shadow(0px 0px 5px #fede27);
}

.campaign_list li {
    display: inline-block;
    position: relative;
    margin: 0 5px 15px 0;
    background: #fff;
    width: 19.2%;
    border-radius: 3px;
}

.campaign_list li:nth-of-type(5n){ margin-right: 0}

.campaign_list li .title {
    padding: 15px 10px 0;
    margin-bottom: 15px;
    font-weight: bold;
    text-align: left;
    font-size: 1.5rem;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    min-height: 66px;
}

.campaign_list li .name_box {
    text-align: center;
    padding: 10px;
    color: #00000080;
    font-size: 1.1rem;
    background: #BBE9FC;
    border-radius: 0 0 3px 3px;
}

.campaign_list li .name_box > p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.checkmark_area { height: 30px;}

.campaign_list li .check_label img {
    margin: 20px auto 0;
    width: auto;
    height: 100px;
    min-height: 100px;
}
.check_label input { display: none;}
.check_label {
    display: block;
    position: relative;
    cursor: pointer;
    user-select: none;
}
/* □ */
.check_label .checkmark {
  position: absolute;
  top: 1rem;
  right: 1rem;
  /* transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%); */
  height: 28px;
  width: 28px;
  border: solid 2px #d4dae2;
  border-radius: 4px;
  box-sizing: border-box;
}
/* ✓ */
.check_label .checkmark:after {
  content: "";
  position: absolute;
  left: 7px;
  top: 2px;
  width: 9px;
  height: 13px;
  border: solid #1da2db;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
}

/* チェックが入ったときの□ */
.check_label input:checked + .checkmark {
  background: #fede27;
  border-color: #fede27;
}

/* チェックが入ったときの✓ */
.check_label input:checked + .checkmark:after {
  opacity: 1; /* 透明を解除 */
}

.caution {
    text-align: left;
    margin: 50px auto 60px;
    font-size: 13px;
    line-height: 1.5em;
    color: #333;
}

.caution .head-border {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.caution .head-border:before, .head-border:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #666;
}

.caution li {
    position: relative;
    padding: 0 0 0 15px;
    margin: 5px 0;
}

.caution li::before {
    counter-increment: list;
    content: "";
    display: block;
    position: absolute;
    left: 0px;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: #666;
    top: 6px;
}

.all_check {
    /* text-align: right; */
    margin-bottom: 15px;
    padding-left: 30px;
    display: inline-block;
}

.all_check .check_label .checkmark {
    top: 13px;
    left: auto;
    margin-left: -25px !important;
}

.submit_area {
    margin: 20px auto;
    text-align: center;
    background: #fff;
    padding: 30px;
}

.submit_area .link {
    margin-bottom: 30px;
}

.submit_area .check_label .checkmark {
    top: 13px;
    left: -36px;
}
.submit_check_list {
    text-align: left;
    width: 500px;
    margin: 20px auto;
}

.lead {
    /*margin: 30px 0 0;*/
}

.lead .tbl-title {
    background: #82ce5c;
    color: #fff;
    font-weight: bold;
    padding: 5px 0;
}

.lead h2 {
    margin-bottom: 20px;
    line-height: 1.9em;
    font-size: 2rem;
    font-weight: bold;
}
.lead h3 {
    font-weight: bold;
}

.lead h2 span {
    font-size: 3rem;
    padding-bottom: 3px;
    color: #f39800;
    font-weight: bold;
    text-decoration: #fff double underline;
}

.lead .tbl-r01 {
    margin: 15px auto;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

.lead th {
    background: #e5ebeb;
    border: solid 1px #c1dcde;
    padding: 10px;
    width: 10%;
    text-align: center;
    font-weight: bold;
}

.lead td {
    background: #ffffff;
    border: solid 1px #c1dcde;
    padding: 5px;
    width: 10%;
    font-weight: bold;
    vertical-align: middle;
}

.lead td span {
    font-size: 12px;
    font-weight: normal;
    color: #ff9c00;
}

.lead strong {
    color: #f02626;
}

.lead .sub {
    font-size: 1.3rem;
    margin-top: 10px;
}

.sub-info {
    width: 670px;
    padding: 20px;
    margin: 0 auto 20px;
    font-weight: bold;
    border: solid 3px #013589;
    color: #013589;
    border-radius: 5px;
}

.bg_yellow { background: #fede27 !important; }

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

/* pc & sp
----------------------------------------------------------- */
.mv_illust img                      { margin: auto;}
.pc									{ margin: auto;}
.sp									{ display: none;}

/* flex
----------------------------------------------------------- */
.flex 									{ display: flex;}
.flex_center 							{ justify-content: center;}
.between 								{ justify-content: space-between;}
.reverse 								{ flex-direction: row-reverse;}
.wrap									{ flex-wrap: wrap;}

/* width
-----------------------------------------------------------  */
.mv_illust
										{ margin: 0 auto 50px;}
.inner 									{ margin: 0 auto; width: 1100px;}
footer .inner 							{ margin: 0 auto; width: 1200px;}

/* container
----------------------------------------------------------- */
#container {
	font-size: 17px; font-size: 1.7rem;
	line-height: 1.5;
	color: #333;
	letter-spacing: 0.05em;
	text-align: left;
	overflow: hidden;
	}


/* header
----------------------------------------------------------- */
.header 								{ padding: 10px 0 10px;}
.header p.logo a 						{ display: block; width: 350px; height: 40px;}

/* mV
----------------------------------------------------------- */
.mV 									{ text-align: center; position: relative;; background-size: cover; background-image: url("../img/fv_bg.png");}

/* scrollBlock
----------------------------------------------------------- */
.scrollBlock 							{ padding: 30px 0;}

/* mVbottom
----------------------------------------------------------- */
.mVbottom 								{ padding: 30px 0 50px 0;}

/* footerNav
----------------------------------------------------------- */
.footerNav								{}
.footerInner 							{ padding: 30px 0 30px 0; font-size: 1.8rem;}
.footerInner ul 						{ padding: 20px 0 0 0;}
.footerInner ul li 						{ display: inline; font-size: 1em;}
.footerInner ul li:before 				{ content: "|"; padding: 0 0.6rem; color: #fff;}
.footerInner ul li:nth-child(1):before 	{ display: none;}
.footerInner ul li a					{ text-decoration: none; color: #fff;}

}

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

/* width
-----------------------------------------------------------  */
.inner 									{ margin: 0 auto; width: 96%;}

.inner02
 										{ margin: 0 auto; width: 96%;}
.checkList
 										{ margin: 0 auto; width: 96%;}

/* footerNav
----------------------------------------------------------- */
.footerNav								{}

.footerInner 							{ padding: 2rem 0 2rem 0; display: block;}
.footerInner .logo 						{ margin: 0 auto; width: 100px;}
.footerInner ul 						{ padding: 1rem 0 0 0; display: block; text-align: center;}
.footerInner ul li 						{ display: inline;}
.footerInner ul li:before 				{ content: "|"; padding: 0 0.6rem; color: #fff;}
.footerInner ul li:nth-child(1):before 	{ display: none;}

.footerInner ul li a					{ text-decoration: none; color: #fff;}

}


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

/* pc & sp
----------------------------------------------------------- */
.pc										{ display: none;}
.sp										{ display: block;}

/* flex
----------------------------------------------------------- */
.flex 									{ display: flex;}
.flex_center 							{ justify-content: center;}
.between 								{ justify-content: space-between;}
.reverse 								{ flex-direction: row-reverse;}
.wrap									{ flex-wrap: wrap;}

/* width
-----------------------------------------------------------  */
.mv_illust
										{ margin: 0 auto; width: 100%;}
.inner 									{ margin: 0 auto; width: 100%;}

/* container
----------------------------------------------------------- */
#container {
	font-size: 17px; font-size: 1.7rem;
	line-height: 1.5;
	color: #333;
	letter-spacing: 0.05em;
	text-align: left;
	overflow: hidden;
	}

/* header
----------------------------------------------------------- */
.header 								{ padding: 5px 0;}

.header p.logo img 						{ width: 50%;}
/* mV
----------------------------------------------------------- */
.mV{
    text-align: center;
    position: relative;
    background-size: cover;
    background-image: url(../img/fv_bg.png);
}
.mv_illust{
    padding: 10px;
}
.mv_illust
										{ height: auto; margin: 3% auto 6%;}
.mv_illust img 							{ position: relative; margin: 0 auto; width: 90%; max-width: 100%; z-index: 2;
}

/* scrollBlock
----------------------------------------------------------- */
.scrollBlock 							{ padding: 1rem 0;}

/* mVbottom
----------------------------------------------------------- */
.mVbottom 								{ padding: 2rem 0 4rem 0;}

/* footerNav
----------------------------------------------------------- */
.footerNav								{}
.footerInner 							{ padding: 2rem 0 2rem 0; display: block;}
.footerInner .logo 						{ margin: 0 auto; width: 100px;}
.footerInner ul 						{ padding: 1rem 0 0 0; display: block; text-align: center;}
.footerInner ul li 						{ display: inline;}
.footerInner ul li:before 				{ content: "|"; padding: 0 0.6rem; color: #fff;}
.footerInner ul li:nth-child(1):before 	{ display: none;}
.footerInner ul li a					{ text-decoration: none; color: #fff;}

/* footer
----------------------------------------------------------- */

/* font
----------------------------------------------------------- */

.submitbtnBox .btn
										{ font-size: 2.2rem;}
.categorybtnBox .btn span
										{ font-size: 2.0rem;}
.formBlock p.link,
.formBlock p.head,
.checkList
										{ font-size: 1.8rem; color: #1da2db;}

.formBlock table th span.name
										{ font-size: 1.6rem;}

.formBlock table td span.txt
										{ font-size: 1.4rem;}
.formBlock table th span.need
										{ font-size: 1.2rem;}
.footerInner ul li,
.footer	p.copy small
										{ font-size: 1.2rem;}

.mV_title {
  position: relative;
  width: 860px;
  margin: auto;
  padding: 50px 0;
}
.bottom-scroll-navi-detail {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    height: 95px;
    background: #FFFBEF;
    box-shadow: 0 -3px 2px rgba(0,0,0,.2);
}
.title-btn {
    font-weight: 500;
    color: #333;
    float: left;
    position: relative;
    text-align: center;
    font-size: 19px;
}
.navi-num {
    color: #4053A2;
    font-size: 160%;
    position: relative;
    top: 2px;
    left: -1px;
}
.sp-only { display: block;}

.content { padding-top: 30px; }

.campaign_info { margin-bottom: 50px;}

.btn_box {
    margin: 0 auto 20px;
}

.btn1{
	font-size:1.7rem;
    width: 100%;
    line-height: 1.2em;
}

.mail_box {
    width: auto;
    padding: 20px;
}

.mail_box input[type="email"] { width: 90%;}

.campaign_list_title { font-size: 2rem; }

.campaign_list li { width: 47.8%;}

.submit_check_list .check_label p {padding-left: 50px;}

.submit_area .check_label .checkmark {
    top: 20px;
    left: 20px;
}

.lead h2 {font-size: 1.7rem;}
.lead h2 span {font-size: 3rem;}

.lead h3 {font-size: 1.5rem;}

.lead .tbl-title {font-size: 1.3rem;}

.lead .tbl-r01 tbody {
    display: block;
    float: left;
}

.lead .tbl-r01 thead {
    display: block;
    float: left;
}

.lead .tbl-r01 tr {
    display: block;
    float: left;
}

.lead .tbl-r01 tr td, .lead .tbl-r01 tr th {display: block;}

.lead .tbl-r01 th {width: 30vw;}

.lead .tbl-r01 td {
    width: 48vw;
    border-left: none;
    height: 35.5px;
    line-height: 1;
}

.lead td span {margin-left: 5px;}

.sub-info {
    width: 90%;
    padding: 4%;
    font-size: 1.5rem;
}

}


ul.campaign_list{
    display: flex;
    flex-wrap: wrap;
}
ul.campaign_list li{
    display: block;
    width: 20%;
    padding:0 3px 15px 3px;
    margin: 0;
    position:relative;
    margin-bottom:20px;
    box-sizing: border-box;
    background: none;
}
ul.campaign_list li.done {
    position: relative;
    order: 1;
}
ul.campaign_list li.done label {
    opacity: 0.3;
}
ul.campaign_list li.done:after {
    content: "ダウンロード済み";
    opacity: 1;
    font-weight: bold;
    font-size: 20px;
    position: absolute;
    top: 30%;
    display: inline;
    width: 100%;
    text-align: center;
}
/* --- TAG --- */
ul.campaign_list .tag{
    z-index: 50;
    border: 1px solid #013589;
    color:#013589;
    padding: 0.3rem 0.6rem 0.4rem;
    font-size: 13px;
    line-height: 1.3rem;
    font-weight: 500;
    border-radius: 2px;
    position: absolute;
    left: 0.9rem;
    top: 0.6rem;
}
ul.campaign_list .tag.keiri{
    color: #1cb8c2;
    border-color: #1cb8c2;
}
ul.campaign_list .tag.jinji{
    color: #ff9639;
    border-color:#ff9639;
}
ul.campaign_list .tag.houmu{
    color: #92c508;
    border-color: #92c508;
}
 ul.campaign_list li.tag_estimate label::before {
    content: '見積・請求書発行';
    color: #00bee5;
    border: 1px solid #00bee5;
}
ul.campaign_list li.tag_accept label::before {
    content: '受取請求書';
    color: #00bee5;
    border: 1px solid #00bee5;
    padding: 0.3rem 0.6rem 0.4rem;
}
ul.campaign_list li.tag_management label::before {
    content: '人事管理';
    color: #ff9639;
    border: 1px solid #ff9639;
    padding: 0.3rem 0.6rem 0.4rem;
}
ul.campaign_list li.tag_insurance label::before {
    content: '社会保険・労働保険管理';
    color: #ff9639;
    border: 1px solid #ff9639;
    padding: 0.3rem 0.6rem 0.4rem;
}
ul.campaign_list li.tag_timecard label::before {
    content: '勤怠管理';
    color: #ff9639;
    border: 1px solid #ff9639;
    padding: 0.3rem 0.6rem 0.4rem;
}
ul.campaign_list li.tag_review label::before {
    content: '契約書レビュー';
    color: #9ac909;
    border: 1px solid #9ac909;
    padding: 0.3rem 0.6rem 0.4rem;
}
ul.campaign_list li.tag_management label::before {
    content: '契約書管理';
    color: #9ac909;
    border: 1px solid #9ac909;
    padding: 0.3rem 0.6rem 0.4rem;
}
ul.campaign_list li.campaign-tag label::after{
    width: 91%;
    text-align: center;
    content:'キャンペーン対象';
    font-size:14px;
    line-height:1.4rem;
    color: #fff;
    font-weight: bold;
    background: #f39800;
    border-radius: 4px 4px 0 0;
    padding: 0.6rem 1rem;
    position: absolute;
    /* left: 0.6rem; */
    top: -2.2rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
/* --- END TAG --- */
ul.campaign_list li label{
    background: #ffffff;
}
ul.campaign_list .thmb{
    height: 200px;
    position: relative;
    background: #ffffff;
    overflow: hidden;
}
ul.campaign_list .thmb img{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto auto;
    width: 100%;
}

@media screen and (max-width: 760px){
    ul.campaign_list li{
        width: 50%;
    }
}


/*---others---*/
.tac{
    text-align: center;
    width: 82%;
    margin: 0 auto;
}
.box-top{
    padding-top:4rem;
    padding-bottom:4rem;
}
.box-top02 {
    padding: 3rem;
    text-align: center;
}
.wrapper{
    width: 1010px;
    margin: 0 auto;
}
#others{
	background-image: url("../img/bg03.jpg");
	-webkit-background-size: cover;
	background-size: cover;
}
h2.til2{
margin-bottom: 2rem;
font-size: 2.4rem;
font-weight: bold;
text-align: center;
}

h2.til2 span{
    margin: 2rem;
    color: white;
    background-color: #f39800;
    font-weight: bold;
    padding: 0.1rem 0.3rem 0.3rem 0.7rem;
    font-size: .9em;
}

#others .txt{
	text-align: center;
	background: #ed351d;
	padding: 0.6rem 1rem;
	border-radius: 999px;
	width: 240px;
	color: #fff;
	font-weight: bold;
	font-size: 1.8rem;
/*	line-height: 2.8rem;*/
	margin: 1.6rem auto 1rem;
}
#others h3{
	max-width: 890px;
	margin: 0 auto;
}
.a-img img{
	transition:.2s;
}
.a-img img:hover{
	opacity: 0.6;
}
.step-clear{
	background:#fff;
	border:1px solid #ed351d; 
	text-align: center;
	padding: 0.6rem 2.4rem 1rem;
	border-radius:999px;
	color: #ed351d;
	font-weight: bold;
	font-size: 2rem;
	margin: 0 auto 3.2rem;
	max-width: 340px;
}
.step-clear span{
	color: #ed351d;
	font-weight: bold;
	font-size: 2.8rem;
	margin-left: 0.2rem;
	margin-right: 0.2rem;
}
.campaign_text{
    font-family: "corporate-logo-ver2", sans-serif;
    font-weight: 700;
    font-size: 1.5em;
    line-height: 3.5rem;
    margin: 0 0 10px;
}
.campaign_text p{
    font-weight: bold;
}
.campaign .small{
    font-size: .7em;
    font-family: "Noto Sans JP", sans-serif;
}
.tokuten{
    padding: 2% 3%;
    background: #fff;
    border-radius: 8px;
}
.tokuten_description{
    font-family: 'Noto Sans JP', sans-serif !important;
    margin: 1rem 0;
    line-height: 2.2rem;
}
.tokuten_note{
    font-family: 'Noto Sans JP', sans-serif !important;
    font-size: .7em;
    line-height: 1.5rem;
}
.explanation_li{
    width: 60%;
    margin: 0 auto;
}
.graph{
    text-align: left;
}
.orange{
    color: #f39800;
    font-weight: 700;
    font-size: 1.3em;
}
.green{
    color: #22ac38;
    font-weight: 600;
    font-size: 1.3em;
}
.bg-yellow{
    background: #fff198;
}
.bg-yellow02{
    background: #ffdd5a;
}
.bg-green{
    background: #82ce5c;
}
.others-li{
    justify-content: space-between;
    flex-wrap: wrap;
}
.others-li li{
    width: 24%;
    height: 200px;
    box-sizing:border-box;
    padding: 24px 24px;
    background: #fff;
    position:relative;
    transition:.4s;
    border-radius:8px;


}
.others-li li:hover{
    margin-top: -4px;
    margin-bottom: 4px;
    box-shadow: 0px 0px 16px rgba(0,0,0,0.1);
}
a.others-con{
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left: 0;
    transition:.4s;
    
}

.others-box{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.others-box_img{
    margin-bottom: 4px;
}

.others-box_img img {
    width: 32px;
    margin: 0 auto 0.8rem;
}

.others-box h3{
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 2.6rem;
    margin-bottom: 24px;
    width: 240px;
    color: #333;
}
.others-box h3 span{
    color: #22ac38;
    font-size: 2rem;
    font-weight: bold;
}
.login_txt{
    text-align: center;
    font-weight: bold;
    font-size: 2rem;
}
.login_btn {
    max-width: 400px;
    width: 100%;
    display: block;
    margin: 0 auto; /* ← 中央寄せ */
    text-decoration: none;
  }
  .btn1 {
    transition: all 0.3s ease;
    color: #fff!important;
    cursor: pointer;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    background: #f39800;
    border-radius: 4px;
    height: 54px;
    line-height: 54px;
    margin-top: 20px;
    text-decoration: none!important;
  }
  .sp_br{
    display: none;
}
@media screen and (max-width: 1024px) {
    .wrapper {
    width: 800px;
    margin: 0 auto;
/*	overflow: hidden;*/
        box-sizing: border-box;
}
}
@media screen and (max-width:769px) {
    .others-li li{
        width: 48%;
        margin-bottom: 32px;
    }

    .wrapper,.wrapper-contact{
    max-width: 680px;
    margin: 0 auto;
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
    overflow: hidden;
}
}
@media screen and (max-width:640px) {

    .wrapper,.wrapper-contact{
        width: 100%;
        max-width: 680px;
        margin: 0 auto;
            padding-left: 10px;
            padding-right: 10px;
            box-sizing: border-box;
        overflow: hidden;
    }
/*---end others---*/
.others-li li{
    width: 90%;
    height: 180px;
    margin: 0 auto 16px;
}
.others-li li:last-of-type{
    margin-bottom: 0;
}

.explanation_li {
    width: 100%;
}
.campaign_text {
    margin: 0 0 0;
}
.tokuten {
    padding: 2%;
}
.tac {
    width: 100%;
    text-align: center;
    margin: 5% 0 0;
}
.sp_br{
    display: block;
}
}
.btn1 span{
    font-weight: bold;
    font-size: .9em;
}
.manegy_login {
    margin: 0 auto;
    max-width: 600px;
    width:100%;
}
.manegy_login ul {
    display: flex;
    flex-wrap:wrap;
    padding: 8px;
    justify-content: center;
    margin-bottom: 8px;
}
.manegy_login ul li {
    padding: 8px;
    width: 100%;
}
.manegy_login ul li dt {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 4px;
    text-align: left;
}
.manegy_login input {
    width: 100%;
    box-sizing: border-box;
    padding: 1rem 16px;
    border: 1px solid #fff;
    background: #fff;
    border-radius: 4px;
    margin:0;
}
.mail_box input[type="email"]{
    margin:0;
    width:100%;
}
.manegy_login .btn1{
    margin-bottom:1rem;
}
#login h2.til2{
    font-weight: bold;
    color:#333;
    font-size:1.8rem;
    line-height:2.8rem;
}
.login-btn .txt a{
    color:#333;
    padding-bottom:0.1rem;
    margin-bottom:0.4rem;
}

.login-btn .txt a:hover{
    opacity:0.7;
}
.btn_regist{
    color:#333;
    margin-bottom:0.8rem;
}
.txt-b{
    font-weight: normal !important;
    margin-top:1rem;
    font-size: 14px;
    line-height:2rem;
}
@media screen and (max-width:769px) {
    .manegy_login ul li {
        padding: 0px;
        margin-bottom:0.8rem;
        width: 100%;
    }
    .manegy_login ul li:last-of-type{
        margin-bottom:1.6rem;
    }
}

ul.campaign_list li label::before {
    font-size: 10px;
    line-height: 1.0em;
    position: absolute;
    top: 0;
    left: 0;
    margin: 10px;
    padding: 4px;
}
ul.campaign_list li.tag_cloud_accounting label::before {content: 'クラウド会計・会計システム'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_expense label::before {content: '経費精算'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_invoice label::before {content: '見積・請求書発行'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_settlement label::before {content: '決済代行・決済サービス'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_tax_system label::before {content: '税務'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_erp label::before {content: 'ERP'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_outsourcing label::before {content: '経理アウトソーシング'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_credit label::before {content: '与信管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_clearing label::before {content: '入金消込'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_electronic_book label::before {content: '電子帳簿保存法対応'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_accounting_firms label::before {content: '会計事務所向けサービス'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_receipt label::before {content: '受取請求書'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_billing label::before {content: '請求代行サービス'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_fundraising_ma label::before {content: 'M&A関連サービス'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_ordering label::before {content: '受発注管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_groupware label::before {content: 'グループウェア'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_welfare label::before {content: '福利厚生'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_corporate_communication label::before {content: '企業内コミュニケーション'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_shareoffice label::before {content: 'シェアオフィス・レンタルオフィス・ワーキングスペース'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_office_relocation label::before {content: 'オフィス移転・デザイン'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_office_equipment label::before {content: 'オフィス設備・機器・備品'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_remote_access label::before {content: 'リモートアクセス'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_access_control label::before {content: '入退室管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_online_storage label::before {content: '文書管理・オンラインストレージ'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_paperless label::before {content: 'ペーパーレス会議'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_travel_management label::before {content: '出張管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_disaster_prevention label::before {content: '安否確認・非常時対応'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_manual_creation_tool label::before {content: 'マニュアル作成ツール'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_workflow label::before {content: '稟議・ワークフロー'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_chatbot label::before {content: 'チャットボット'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_inquiry_management label::before {content: '問い合わせ管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_vehicle_management label::before {content: '車両管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_project_management_tool label::before {content: 'プロジェクト管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_ocr label::before {content: '文書電子化・OCR'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_conference_reservation label::before {content: '会議室予約システム'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_seat_reservation label::before {content: '座席管理システム'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_humanresource_management label::before {content: '人事管理'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_personnel_assessment label::before {content: '人事評価・目標管理'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_attendance_management label::before {content: '勤怠管理'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_payroll label::before {content: '給与計算・明細'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_salary_prepayment label::before {content: '給与前払い'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_year_end_adjustment label::before {content: '年末調整・法定調書'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_social_nsurance label::before {content: '社会保険・労働保険管理'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_individual_number_management label::before {content: 'マイナンバー管理'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_mental_health_care label::before {content: 'メンタルヘルスケア・ストレスチェック'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_employee_survey label::before {content: '組織診断・従業員満足度調査'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_whistle_blowing label::before {content: '内部通報'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_recruitment_management label::before {content: '採用管理'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_web_meeting label::before {content: 'Web会議・面接'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_aptitude_test label::before {content: '適性検査'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_e-learning label::before {content: 'eラーニング'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_training label::before {content: '研修'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_english label::before {content: '英語'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_hr_outsourcing label::before {content: '人事アウトソーシング'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_one_on_one label::before {content: '1on1'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_l_ssa_office label::before {content: '社労士事務所向けサービス'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_employment_support label::before {content: '障がい者雇用支援'; color: #ff9639; border: 1px solid #ff9639;}
ul.campaign_list li.tag_electronic_contract label::before {content: '電子契約'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_contract_review label::before {content: '契約書レビュー'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_contract_management label::before {content: '契約書管理'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_digital_crisis label::before {content: '風評被害対策'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_anti_company_check label::before {content: '反社チェック'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_establishment label::before {content: '会社設立・登記'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_general_meeting_of_shareholders label::before {content: '株主総会'; color: #92c508; border: 1px solid #92c508;}
ul.campaign_list li.tag_business_analysis label::before {content: '経営分析'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_rpa label::before {content: 'RPA'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_it_outsourcing label::before {content: 'ITアウトソーシング'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_subsidy label::before {content: '補助金'; color: #1cb8c2; border: 1px solid #1cb8c2;}
ul.campaign_list li.tag_budgetary-control label::before {content: '予算管理'; color: #1cb8c2; border: 1px solid #1cb8c2;}


#submit_1 {
    transition: all 0.3s 0s ease;
    color: #02398a;
    pointer-events: auto;
    cursor: pointer;
    border: none;
    text-align: center;
    margin: 0 auto;
    position: relative;
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    width: 360px;
    background: #fede27;
    height: 54px;
}

#submit_1::after {
    content: "";
    display: block;
    position: absolute;
    top: 49%;
    right: 18px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #02398a;
    border-right: 2px solid #02398a;
    transform: rotate(45deg) translateY(-50%);
}
.form {
    margin: 0 auto!important;
    padding: 0!important;
}
.form table ,
.form h2 {
    display: none;
}

.submitbtnBox {
    padding-bottom: 0!important;
}

#container header {
    max-width: 1100px;
    margin: 0 auto;
    padding: 10px 0 0;
    box-sizing: border-box;
    position: static;
}

.footerInner img{
    width: 80%;
}

.login inner{
    padding: 1em;
}

.sp-br{
    display: none;
}

@media screen and (max-width: 1024px){
    .step_num {
        position: absolute;
        top: 0%;
        left: 50%;
        right: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        width: 38%;
    }
    .step-li li {
        width: 28%;
        box-sizing: border-box;
        padding: 6% 2% 2%;
        background: #fff;
        border-radius: 8px;
        margin: 0 auto;
        position: relative;
        margin: 4% auto 2%;
        font-size: .8em;
    }
    footer .inner {
        margin: 0 auto;
        /* width: 1200px; */
        width: 100%;
    }
    .footerInner ul {
        padding: 1rem 1rem 0;
        display: block;
        text-align: center;
    }
    .mv_illust{
        width: 55%;
    }
}
@media screen and (max-width: 1110px){
    .mv_illust .woman {
        right: -17%;
    }
    .mv_illust .man {
        left: -17%;
    }
}
@media screen and (max-width: 920px){
    .mv_illust .man,
    .mv_illust .woman {
        bottom: -26%;
    }
    .mv_illust{
        width: 70%;
    }
}
@media screen and (max-width: 820px){
    .mv_illust .man,
    .mv_illust .woman {
        bottom: -23%;
    }
    .mv_illust{
        width: 73%;
    }
}
@media screen and (max-width: 768px){
    .step-li li {
        width: 28%;
        box-sizing: border-box;
        padding: 7% 2% 0%;
        background: #fff;
        border-radius: 8px;
        margin: 0 auto;
        position: relative;
        margin: 4% auto 2%;
        font-size: .8em;
    }
    .step-li p {
        text-align: center;
        line-height: 1.2em;
        padding-bottom: 8%;
        height: 24%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .mv_illust .man,
    .mv_illust .woman {
        bottom: -22%;
    }
    ul.campaign_list li.campaign-tag label::after{
        width: 88%;
    }
    .explanation_li {
        width: 80%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 640px){
.campaign_text {
    font-size: 2.3rem;
    line-height: 3rem;
    padding: 1rem;
}
.explanation_li {
    width: 90%;
    margin: 0 auto;
}
.tokuten_description {
    font-size: 1.5rem;
    line-height: 2rem;
    margin: 1rem 2rem;
}
.tokuten_note {
    font-size: 1.2rem;
    line-height: 1.5rem;
    margin: 1rem 2rem;
}
#submit_1 {
    font-size: 16px;
    width: 100%;
    padding-right: 10px;
}
.sp-br{
    display: block;
}
.flex {
    display: block;
}
.step-li li {
    width: 90%;
    box-sizing: border-box;
    padding: 13% 2% 2%;
    background: #fff;
    border-radius: 8px;
    margin: 0 auto;
    position: relative;
    margin: 16% auto 2%;
}
.step-li p {
    text-align: center;
    line-height: 1.2em;
    padding-bottom: 3%;
    height: 24%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2em;
}
.campaign{
    display: flex;
}
.box-top02 {
    padding: 2rem;
    z-index: 10;
    position: relative;
}
.mv_illust h1 {
    font-weight: 600;
    line-height: 1.3em;
    margin-bottom: 1%;
    font-size: 1.5em;
    text-align: center;
}
.step_num {
    position: absolute;
    top: 0%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    width: 26%;
}
.mv_illust .man,
.mv_illust .woman{
    max-width: 100px;
    bottom: -39%;
    z-index: 5;
}
.mv_illust {
    width: 82%;
}
.mv_illust {
    margin: 1% auto 5%;
}
.mv_illust .ttl{
    padding: 3px 5px;
    margin: 0 2px 6px;
    font-size: .8em;
}
.campaign .small {
    font-size: .6em;
}
.login_txt {
    font-size: 1.6rem;
}
.box-top {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.manegy_login ul li:last-of-type {
    margin-bottom: 0rem;
}
.btn1{
    margin-top: 0;
    height: 70px;
    line-height: 25px;
}
.login_btn.btn1{
    height: 54px;
    line-height: 54px;
    margin-top: 20px;
}
}