@charset "utf-8";
/* CSS Document */
/*
============================================================
*	merit_n.css
==========================================================*/
.pageTit {
  padding: 5px 0!important;
}
/* 登録会について */

.leadTxt {
  font-weight: bold;
  margin-bottom: 20px;
  padding: 0 5px;
}
.sectionTit, .subTit, .sectionText, .infotextBox {
  padding: 0 10px;
}
.sectionTit {
  height: 35px;
  line-height: 35px;
  margin-bottom: 16px;
  vertical-align: middle;
  font-weight: bold;
  background: #e2f3fa;
}
.subTit {
  color: #2ba295;
  font-weight: bold;
  margin-bottom: 12px;
}
.naviTit {
  background: #38b5d5;
  border-top: 1px solid #32a8ce;
  border-bottom: 1px solid #32a8ce;
  color: #ffffff;
  font-size: 20px;
  padding: 5px 0;
  position: relative;
  text-align: left;
  padding-left: 10px;
  margin-bottom: 0;
}
.regiTit {
  height: 44px;
  margin-bottom: 15px;
  line-height: 44px;
  vertical-align: middle;
  font-size: 107.1%;
  font-weight: bold;
  text-align: center;
  background: #e2f3fa;
}
.imgBox {
  text-align: center;
  margin-bottom: 18px;
}
.regiSectionBox {
  margin-bottom: 35px;
}
.infotextBox {
  margin-bottom: 27px;
}
.linkBox {
}
.linkTit {
  padding: 0 10px;
  margin-bottom: 16px;
  border-top: 1px solid #dcdcdc;
  border-bottom: 1px solid #dcdcdc;
}
.linkTit a {
  display: block;
  padding: 18px 0 18px;
  background: url(/sp/img_n/ico_arw_r.png) 100% 50% no-repeat;
  background-size: 12px 12px;
  color: #666;
}
.selectWorkingAreaBox {
  border-top: 1px solid #dcdcdc;
}
.alertText {
  background: url(/sp/img_n/alert_icon.png) no-repeat left top;
  background-size: 14px 14px;
  margin-top: 8px;
  padding-left: 21px;
  color: #ff6666;
}
.selectWorkingAreaBox table.c2list td {
  text-align: center;
  background: #ffffff;
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#ffffff), to(#ececec));
  background: -webkit-linear-gradient(#ffffff, #ececec);
  background: -moz-linear-gradient(#ffffff, #ececec);
  background: -ms-linear-gradient(#ffffff, #ececec);
  background: -o-linear-gradient(#ffffff, #ececec);
  background: linear-gradient(#ffffff, #ececec);
}
.selectWorkingAreaBox table.c2list td a {
  color: #666;
  display: block;
}
.prEntryBox {
  background: url(/sp/img_n/bg_prEntryBox.jpg) 100% 17px no-repeat;
  background-size: 65px 80px;
}
.prEntryBox .prTit {
  border-top: 2px solid #ff6600;
  border-bottom: 2px solid #ff6600;
  background: #fff6ac;
  color: #ff6600;
  text-align: center;
  padding: 11px 0 9px;
}
.prEntryBox .prTxt {
  padding: 20px 0 20px 10px;
}
.prEntryBox .btnReservedEntry {
  text-align: center;
  padding-bottom: 14px;
}
.preBox {
  background: #e2f3fa;
  font-weight: bold;
  padding: 3px;
  margin: 0 10px;
}
.preBox .preTit {
  height: 32px;
  line-height: 1;
  padding-top: 9px;
  font-weight: bold;
  text-align: center;
}
.preBox .preBody {
  background: #fff;
  padding: 10px;
}
.preBox .preBody p {
  margin-bottom: 20px;
}
.preBox .preBody p span {
  color: #ff6600;
}
.preBox .preBody li {
  line-height: 1.4;
  font-weight: normal;
}
.preBox .preBody li span {
  font-weight: bold;
  display: block;
}
.contactTextBox {
  padding: 0 24px 15px;
}
.contactTextBox .text dt {
  font-weight: bold;
}
.bnrFreeDialEntryBox {
  text-align: center;
  background: #e2f3fa;
  margin-bottom: 15px;
}
#support {
  margin-top: 30px;
  margin-bottom: 40px;
}
#support #mental, #support #career, #support #rest, #support #insurance, #support #health {
  text-align: left;
  margin: 20px 5px 0;
  padding: 0 20px 20px;
}
#support .attention {
  font-size: 89%;
  margin-top: 3px;
}
#support #mental {
  /*border:10px solid #fdcede;*/
  border-bottom: 1px solid #dcdcdc;
  background: url(/sp/merit/img_n/welfare_mental.png) no-repeat 20px 0;
  background-size: 25px auto;
  -webkit-background-size: 25px auto;
}
#support #mental h4 {
  color: #ff6d9c;
  font-size: 16px;
  font-weight: bold;
  margin: 15px 10px 10px;
  padding-left: 30px;
}
#support #career {
  /*border:10px solid #ebd0ff;*/
  border-bottom: 1px solid #dcdcdc;
  background: url(/sp/merit/img_n/welfare_career.png) no-repeat 20px 0;
  background-size: 25px auto;
  -webkit-background-size: 25px auto;
}
#support #career h4 {
  color: #a37ccc;
  font-size: 16px;
  font-weight: bold;
  margin: 15px 10px 10px;
  padding-left: 30px;
}
#support #rest {
  /*border:10px solid #fee1b9;*/
  border-bottom: 1px solid #dcdcdc;
  background: url(/sp/merit/img_n/welfare_rest.png) no-repeat 20px 0;
  background-size: 25px auto;
  -webkit-background-size: 25px auto;
}
#support #rest h4 {
  color: #f69400;
  font-size: 16px;
  font-weight: bold;
  margin: 15px 10px 10px;
  padding-left: 30px;
}
#support #insurance {
  /*border:10px solid #c1e6c2;*/
  border-bottom: 1px solid #dcdcdc;
  background: url(/sp/merit/img_n/welfare_insurance.png) no-repeat 20px 0;
  background-size: 25px auto;
  -webkit-background-size: 25px auto;
}
#support #insurance h4 {
  color: #00b608;
  font-size: 16px;
  font-weight: bold;
  margin: 15px 10px 10px;
  padding-left: 30px;
}
#support #health {
  /*border:10px solid #cce8f3;*/
  background: url(/sp/merit/img_n/welfare_health.png) no-repeat 20px 0;
  background-size: 25px auto;
  -webkit-background-size: 25px auto;
}
#support #health h4 {
  color: #5a86ff;
  font-size: 16px;
  font-weight: bold;
  margin: 15px 10px 10px;
  padding-left: 30px;
}
/* スタッフサービスでスキルアップ */
#point_one {
  background: url(/sp/merit/img_n/sp_skillup_point_1.png) no-repeat 10px 10px;
  font-weight: bold;
  margin: 10px 5px;
  min-height: 19px;
  background-size: 18.5px 18.5px;
  -webkit-background-size: 18.5px 18.5px;
  padding: 10px 5px 0 35px;
  border-top: 2px solid #ff7606;
}
#point_two {
  background: url(/sp/merit/img_n/sp_skillup_point_2.png) no-repeat 10px 0;
  font-weight: bold;
  margin: 10px 5px;
  min-height: 19px;
  background-size: 18.5px 18.5px;
  -webkit-background-size: 18.5px 18.5px;
  padding: 0 5px 0 35px;/*border: 1px solid #ff9900;*/
}
#point_three {
  background: url(/sp/merit/img_n/sp_skillup_point_3.png) no-repeat 10px 0;
  font-weight: bold;
  margin: 10px 5px 25px 5px;
  min-height: 19px;
  background-size: 18.5px 18.5px;
  -webkit-background-size: 18.5px 18.5px;
  padding: 0 5px 10px 35px;
  border-bottom: 2px solid #ff7606;
}
#top_img_wrp {
  margin: 20px 5px 15px;
}
#top_img_wrp img {
  float: left;
}
#top_img_wrp p {
  display: table-cell;
  padding-left: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #ff7606;
  text-align: left;
  height: 80px;
  vertical-align: middle;
}
#skillup_support #top_img_wrp p span {
  display: inline-block;
}
.support_contents {
  text-align: left;
  margin: 20px 5px 0;
  border-bottom: 1px solid #DCDCDC;
  padding: 0 20px 20px;
}
.support_contents:last-child {
  border-bottom: none;
}
.support_contents p {
  margin: 5px 0 10px;
}
.nayami {
  border: 5px solid #5fcfe3;
  background: #5fcfe3;
  margin: 10px;
}
.nayami p {
  color: #fff;
  padding: 10px;
  background: url(../merit/img_n/sp_skillup_answer.png) 6px 10px no-repeat;
  background-size: 48px 24px;
  padding-left: 69px;
}
.nayami .who_symble {
  background: #fff;
}
.who_symble img {
  float: left;
  padding-top: 12.5px;
  padding-left: 5px;
  padding-right: 5px;
}
.who_symble p {
  display: table-cell;
  height: 50px;
  padding: 0;
  padding-left: 10px;
  padding-right: 5px;
  vertical-align: middle;
  color: #666;
  background: none;
}
/* 体験レポート */
#top_description {
  background: url(/sp/merit/img_n/top_description.png) no-repeat left 0;
  background-size: 120px auto;
  -webkit-background-size: 100px auto;
  padding-left: 130px;
}
.step_wrapper {
  margin: 0;
  border-bottom: 1px dotted #D6CFBB;
  padding: 15px 5px;
  background-color: #faf7e5;
}
.step_wrapper p {
  text-align: left;
  margin: 10px 0 15px !important;
  padding-left: 10px;
  padding-right: 5px;
  display: table-cell;
  vertical-align: middle;
  clear: both;
}
.step_wrapper img {
  float: left;
  vertical-align: middle;
}
#step1 {
  height: 65px;
  padding-top: 15px;
}
#step2 {
  height: 65px;
  padding-top: 17px;
}
#step3 {
  height: 65px;
  padding-top: 20px;
}
#step4 {
  height: 65px;
  padding-top: 20px;
}
#step5 {
  height: 65px;
  padding-top: 20px;
  color: #FE8430;
}
#step6 {
  height: 65px;
  padding-top: 15px;
}
#step7 {
  height: 65px;
  padding-top: 15px;
}
#step8 {
  height: 65px;
  padding-top: 15px;
  color: #FE8430;
}
#step9 {
  height: 65px;
  padding-top: 15px;
}
#step9 span {
  color: #FE8430;
  display: block;
}
#step10 {
  height: 65px;
  padding-top: 20px;
}
/* 相談できるサポーター */
#profile {
  margin-top: 1em;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 0px;
  /*border-bottom: 1px dotted #124b90;*/
  padding-bottom: 1.3em;
  min-height: 1px;
}
#profile dd, #profile dt {
  float: left;
}
#profile dd {
  width: 30%;
  text-align: left;
}
#profile dd span {
  display: block;
  font-size: 80%;
  margin-bottom: 5px;
}
#profile dd .woman {
  color: #2ba295;
  margin-bottom: 0;
}
#profile dd .man {
  color: #ff6600;
  margin-bottom: 0;
}
#profile dt {
  width: 50px;
  margin-right: 5px;
}
.conversation_wrp {
  margin: 20px 10px 20px !important;
  text-align: left !important;
}
.conversation_wrp img {
  float: left;
}
.conversation_title {
  height: 100px;
  padding-left: 5px;
  vertical-align: middle;
  display: table-cell;
  color: #2ba295;
  font-weight: bold;
}
.middle .conversation_title {
  color: #ff6600;
}
.middle img {
  float: right;
}
section h3 div {
  margin: 0;
  display: inline-block;
  width: 100%;
}
#sub_sections .pink_message {
  font-size: 16px;
  text-align: left;
  font-weight: bold;
  color: #ee73aa;
  margin: 15px 10px 15px;
}
#sub_sections .message {
  text-align: left;
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 0;
}
#sub_sections .message img {
  float: left;
}
#sub_sections .message p {
  display: table-cell;
  padding-left: 10px;
}
.conversation_body {
  margin: 20px 10px;
}
.conversation_body ul {
  text-align: left !important;
}
.conversation_body ul li {
  display: table-cell;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 10px solid #fff;
}
.conversation_body ul li .man {
}
.conversation_body ul li .woman {
}
.conversation_body ul .interviewer, .conversation_body ul .interview_gust {
  display: list-item;
  width: 100px;
  text-align: center;
  float: left;
  margin-right: 10px;
  font-size: 11px;
  background-color: #eeeeee;
  color: #666666;
  border-bottom: 0;
}
.conversation_body ul .interview_gust.lady {
  background-color: #ccf4f0;
  color: #2ba295;
}
.conversation_body ul .interview_gust.gentleman {
  background-color: #ffd9ba;
  color: #ff6600;
}
.pink_message {
  font-size: 16px;
  text-align: left;
  font-weight: bold;
  color: #2ba295;
  margin: 15px 10px 15px;
}
.message {
  text-align: left;
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 0;
}
.message img {
  float: left;
}
.message p {
  display: table-cell;
  padding-left: 10px;
}
/* 福利厚生*/
.welfare_inner {
  margin: 0 10px;
}
#welfare h3.welfare_h3 {
  text-align: center;
  margin: 0 auto 20px;
}
#welfare h3.welfare_h3 span {
  background: linear-gradient(transparent 70%, #def6b5 70%);
  font-size: 20px;
  font-weight: bold;
  color: #4d4d4d;
  display: inline-block;
  padding: 0 3px;
}
#welfare dl dd {
  margin: 20px 10px;
}
#welfare h4.welfare_h4 {
  font-size: 16px;
  color: #ff8e06;
  font-weight: bold;
  text-align: center;
}
#welfare h5.welfare_h5 {
  font-weight: bold;
  margin: 0 0 5px 0;
}
.indent-1em {
  text-indent: -1.3em;
  padding-left: 1.5em;
}
.tbl_holiday {
  overflow-x: scroll;
  overflow-y: hidden;
}
.green {
  color: #7cd59c;
}
.welfare_text_area {
  margin: 0 10px 40px;
}
.welfare_text_area.nom{
  margin: 0 0 40px;
}
.welfare_text_area ul li .archive {
  display: block;
  text-decoration: none;
  color: #ff8b00;
  box-shadow: 0px -1px 6px 3px #ccc;
}
.welfare_text_area ul {
  overflow: hidden;
}
.welfare_text_area ul li.detail {
  display: block;
  padding: 15px 0 0;
  background: #ffffff;
  font-size: 14px;
}
.welfare_text_area li div.archive03 div {
  display: block;
  padding: 10px 10px 8px 0;
  color: #ff8b00;
  margin-bottom: 2px;
  font-size: 16px;
  text-align: center!important;
  position: relative;
  border: 1px solid #ff8b00;
  border-radius: 4px;
  -webkit-box-shadow: 0px 2px 3px 0px rgba(119, 102, 108, 0.2);
	box-shadow: 0px 2px 3px 0px rgba(119, 102, 108, 0.2);
}
.welfare_text_area.nom li div.archive03 div {
  margin: 0 10px 2px 10px;
}

.welfare_text_area li div div::after {
  position: absolute;
  content: "";
  top: 12px;
  right: 35%;
  width: 15px;
  height: 15px;
  background: url(/sp/img_n/ico_datail_minus.png) 50% 50% no-repeat;
  background-size: 15px 15px;
}
.welfare_text_area li div.madoguchi_contents div::after {
  background: none;
}

.welfare_text_area li div.add div::after {
  position: absolute;
  content: "";
  top: 12px;
  right: 30%;
  width: 15px;
  height: 15px;
  background: url(/sp/img_n/ico_datail_plus.png) 50% 50% no-repeat;
  background-size: 15px 15px;
}
.welfare_text_area li div.line2 div::after {
  position: absolute;
  content: "";
  top: 42%;
  right: 10px;
  width: 15px;
  height: 15px;
  background: url(/sp/img_n/ico_datail_minus.png) 50% 50% no-repeat;
  background-size: 15px 15px;
}
.welfare_text_area li div.add.line2 div::after {
  position: absolute;
  content: "";
  top: 42%;
  right: 10px;
  width: 15px;
  height: 15px;
  background: url(/sp/img_n/ico_datail_plus.png) 50% 50% no-repeat;
  background-size: 15px 15px;
}

.welfare_text_area li div.add.archive03 div.off {
  display: none;
}
.welfare_text_area li div.add.archive03 div.on {
  display: block;
}
.welfare_text_area li div.archive03 div.on {
  display: none;
}
.welfare_text_area li div.archive03 div.off {
  display: block;
}
p.btn_ttl {
  text-align: center;
  font-size: 18px;
  font-weight: bold;
}
.mt0 {
  margin: 0!important;
}
.fix {
  display: none;
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 500;
}
.fixUl {
  width: 100%;
  padding: 10px 1.5% 10px;
  display: -webkit-box;/*--- Androidブラウザ用 ---*/
  display: -ms-flexbox;/*--- IE10 ---*/
  display: -webkit-flex;/*--- safari（PC）用 ---*/
  display: flex;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-justify-content: space-between; /* Safari */
  justify-content: space-between;
  background: rgba(255,255,255,1.0);
  box-shadow: 0 -3px 8px 0px rgba(174,174,174,0.8);
  position: relative;
}
/* no.4517035 2025.08.20 ここから修正 */
.fixUl.fw-wrap {
  flex-wrap: wrap;
}
.fixUl .or_link_btn {
  width: 100%;
  padding: 0 1.25%;
}
.fixUl .or_link_btn a {
  font-size: 18px;
  padding: 14px 0;
  margin: 0 auto;
}
.fixUl .or_link_btn .btn_arr::after,
.fixUl .or_link_btn .btn_arr::before {
  transform: scale(0.8);
}
.fixUl .or_link_btn .btn_arr::after {
  right: 11px;
}
/* no.4517035 2025.08.20 ここまで修正 */
.fix li {
  width: 49%;
}
.fix p.close {
  position: absolute;
  right: 10px;
  top: 10px;
}
.fix p.close a {
  display: block;
  width: 20px;
  height: 25px;
  text-align: center;
}
.fix p.close a span {
  display: block;
}
.fix p.close a span {
  z-index: 888;
  position: absolute;
  top: -35px;
  right: 5px;
  height: 30px;
  width: 30px;
  display: block;
  position: relative;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  background: #ccc;
}
.fix p.close a span::before, .fix p.close a span::after {
  content: '';
  height: 2px;
  width: 16px;
  display: block;
  background: #fff;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  position: absolute;
  top: 14px;
  left: 7px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
}
.fix p.close a span::after {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}
.blue_pd {
  height: 70px;
  background: #EEF9FC;
}
/* no.4517035 2025.08.20 ここから修正 */
.blue_pd.h100 {
  height: 100px;
}
/* no.4517035 2025.08.20 ここまで修正 */
/*スタッフサービスのサポート*/
.index_h3 {
  display: inline-block;
  font-size: 20px;
  font-weight: bold;
  color: #4d4d4d;
  padding: 5px 0 2px;
  margin-bottom: 20px;
}
.index_h3.green{
  border-top: 2px solid #dbf682;
  border-bottom: 2px solid #dbf682;
}
.index_h3.purple{
  border-top: 2px solid #ddcef1;
  border-bottom: 2px solid #ddcef1;
}
.index_h3.pink{
  border-top: 2px solid #ffc2cc;
  border-bottom: 2px solid #ffc2cc;
}

.index_point_box.green{
  border-radius: 10px;
  background: #f6f8f2;
  padding: 10px;
  position: relative;
  margin-top: 10px;
}
.index_point_box.green dt{
  color: #a5cd1e;
  margin-bottom: 5px;
  font-size: 17px;
}
.index_point_box.green dd{
  color: #666;
  line-height: 1.7;
}
.balloon-green{
  position: absolute;
  top:5px;
  right: 0;
}
.balloon-green span {
	position: relative;
	display: inline-block;
	padding: 30px 5px 0;
	width: 105px;
	height: 105px;
	vertical-align: middle;
	text-align: center;
	color: #FFF;
	font-size: 14px;
	background: #b8d654;
	border-radius: 50%;
	box-sizing: border-box;
}

.balloon-green span:before{
	content: "";
	position: absolute;
	top: 50%;
	left: -25px;
  	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 20px solid #b8d654;
 	z-index: 0;
}


.index_point_box.purple{
  border-radius: 10px;
  background: #f3f0f8;
  padding: 10px;
  position: relative;
  margin-top: 10px;
}
.index_point_box.purple dt{
  color: #8c6abb;
  margin-bottom: 5px;
  font-size: 17px;
}
.index_point_box.purple dd{
  color: #666;
  line-height: 1.7;
}
.balloon-purple{
  position: absolute;
  top:30px;
  right: 0;
}
.balloon-purple span {
	position: relative;
	display: inline-block;
	padding: 20px 5px 0;
	width: 105px;
	height: 105px;
	vertical-align: middle;
	text-align: center;
	color: #FFF;
	font-size: 14px;
	background: #a38ac5;
	border-radius: 50%;
	box-sizing: border-box;
}

.balloon-purple span:before{
	content: "";
	position: absolute;
	top: 50%;
	left: -25px;
  	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 20px solid #a38ac5;
 	z-index: 0;
}
.index_point_box.pink{
  border-radius: 10px;
  background: #fff6fa;
  padding: 15px;
  margin-top: 10px;
}
.index_point_box.pink dt{
  color: #ff667f;
  margin-bottom: 10px;
  font-size: 17px;
}
.index_point_box.pink dd{
  color: #666;
  line-height: 1.4;
  font-size: 15px;
}
.index_point_box.pink dd p.soudan{
  display: inline-block;
  padding-left: 20px;
  color: #ff667f;
  margin-top: 5px;
}
.index_point_box.pink dd .tag{
  display: inline-block;
  border-top: 1px solid #ff667f;
  border-bottom: 1px solid #ff667f;
  border-left: 1px solid #ff667f;
  border-radius: 3px 0 0 3px;
  margin-top: 5px;

}
.index_point_box.pink dd .tag span{
  position: relative;
  display: inline-block;
  padding: 0 3px;
  background: #fff;
  color: #ff667f;
  font-size: 13px;
  z-index: 1;
}
.index_point_box.pink dd .tag span::after {
  position: absolute;
  top: 0;
  right: -7px;
  content: '';
  width: 15px;
  height: 15px;
  border: 1px solid;
  border-color: #ff667f #ff667f transparent transparent;
  transform: rotate(45deg);
  background: #fff;
  z-index: -1;

}

/*スキルアップをサポート*/
body {
  counter-reset: number 0;
}
.skillup_point_ttl {
  font-size: 17px;
  font-weight: bold;
  color: #ff8e06;
  text-align: center;
}
.skillup_point {
  border-top: 2px solid #ff8e06;
  border-bottom: 2px solid #ff8e06;
  padding: 20px;
  margin: 0 0 30px 0;
}
.skillup_point li {
  font-size: 16px;
  margin-bottom: 10px;
  text-indent: -1.3em;
  padding-left: 1.3em;
}
.skillup_point li:last-child {
  margin-bottom: 0;
}
.skillup_point li::before {
  counter-increment: number 1;
  content: counter(number) " ";
  color: #ff8e06;
  font-weight: bold;
  margin-right: 5px;
}
.skillup_h3 {
  position: relative;
  padding: 10px 0 0 10px;
  margin: 0 5px 10px;
  z-index: 1;
  font-size: 19px;
  font-weight: bold;
  line-height: 1.2;
  letter-spacing: 0.7;
  display: inline-block;
  color: #4d4d4d;
}
.skillup_h3::before {
  content: "◆";
  color: #f2e4f8;
  font-size: 50px;
  position: absolute;
  left: -10px;
  top: -10px;
  z-index: -1;
}
.skillup_h4 {
  position: relative;
  padding: 10px 0 0 30px;
  margin: 5px 0 10px;
  z-index: 1;
  font-size: 17px;
  text-align: left;
  font-weight: bold;
  color: #4d4d4d;
}
.skillup_h4::before {
  content: "◆";
  color: #e7f5fb;
  font-size: 34px;
  position: absolute;
  left: 10px;
  top: -5px;
  z-index: -1;
}
.skillup_contents {
  margin: 0 10px 30px;
}
.or_link_btn a {
  display: block;
  border: 1px solid #ff8e06;
  border-radius: 4px;
  padding: 10px 0;
  font-size: 20px;
  line-height: 1.2;
  color: #ff8e06;
  text-align: center;
  width: 100%;
  margin-top: 20px;
  -webkit-box-shadow: 0px 2px 3px 0px rgba(119, 102, 108, 0.2);
	box-shadow: 0px 2px 3px 0px rgba(119, 102, 108, 0.2);
}
.or_link_btn .btn_arr {
  position: relative;
  display: inline-block;
  width: 100%;
}
.or_link_btn .btn_arr:before {
  content: '';
  width: 20px;
  height: 20px;
  background: #ff8e06;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -10px;
}
.or_link_btn .btn_arr:after {
  content: '';
  width: 0;
  height: 0;
  border: solid 5px transparent;
  border-left: solid 8px #fff;
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -5px;
}
@media screen and (max-width: 362px) {
.skillup_h3 {
  font-size: 17px;
  letter-spacing: -0.8px;
  }
.or_link_btn a {
    font-size: 17px;
}
.balloon-green{
  position: absolute;
  top:5px;
  right: -5px;
}
.balloon-green span {
	padding: 30px 5px 0;
	width: 100px;
	height: 100px;
}

.balloon-green span:before{
	content: "";
	position: absolute;
	top: 50%;
	left: -25px;
  	margin-top: -15px;
	border: 15px solid transparent;
	border-right: 15px solid #b8d654;
 	z-index: 0;
}

.balloon-purple{
  position: absolute;
  top:35px;
  right: -5px;
}

.balloon-purple span {
	padding: 15px 5px 0;
	width: 85px;
	height: 85px;
}
.index_point_box.pink dd p.soudan {
    display: inline-block;
    padding-left: 15px;
    color: #ff667f;
  letter-spacing: -1px;
}
#school .tab_item {
  margin-right: 7px!important;
}
#school .tab_item.nom {
    margin-right: 0px!important;
    float: right;
}
}

/*専門の相談窓口*/
.madoguchi_menu li a{
  display: block;
  padding: 20px 15px 20px 60px;
  border-top: 1px solid #fcfcfc;
  border-bottom: 1px solid #cdcdcd;
  position: relative;
  color: #4d4d4d;
  font-weight: bold;
}
.madoguchi_menu li a::after{
display: block;
content: "";
position: absolute;
top: 50%;
right: 10px;
width: 6px;
height: 6px;
margin: -4px 0 0 0;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
}
.madoguchi_menu li:nth-child(1) a{
background: #d7e2f2 url(/sp/merit/img_n/ico_madoguchi01.png)  no-repeat 10px 50% / 41px 41px;
}
.madoguchi_menu li:nth-child(2) a{
background: #ffdce6 url(/sp/merit/img_n/ico_madoguchi02.png) no-repeat 10px 50%/ 41px 41px;
}
.madoguchi_menu li:nth-child(3) a{
background: #d2f3f1 url(/sp/merit/img_n/ico_madoguchi03.png) no-repeat 10px 50% / 41px 41px;
}
.madoguchi_menu li:nth-child(4) a{
background: #fdefcc url(/sp/merit/img_n/ico_madoguchi04.png) no-repeat 10px 50% / 41px 41px;
}

.madoguchi_menu li:nth-child(1) a::after{
border-right: solid 3px #376dbe;
border-bottom: solid 3px #376dbe;
}
.madoguchi_menu li:nth-child(2) a::after{
border-right: solid 3px #ff5283;
border-bottom: solid 3px #ff5283;
}
.madoguchi_menu li:nth-child(3) a::after{
border-right: solid 3px #0abfb4;
border-bottom: solid 3px #0abfb4;
}
.madoguchi_menu li:nth-child(4) a::after{
border-right: solid 3px #f6ae00;
border-bottom: solid 3px #f6ae00;
}
.madoguchi_h3{
  font-size: 20px;
  font-weight: bold;
  padding: 10px 10px 10px 60px;
  color: #4d4d4d;
}
.madoguchi_h3 span{
  font-size: 13px;
  font-weight: normal;
  display: block;
  letter-spacing: -0.6px;
}
.madoguchi_h3.no1 {
  background: url(/sp/merit/img_n/ico_madoguchi01.png) no-repeat  10px 50% / 41px 41px;
}
.madoguchi_h3.no2 {
  background: url(/sp/merit/img_n/ico_madoguchi02.png) no-repeat 10px 50% / 41px 41px;
}
.madoguchi_h3.no3 {
  background: url(/sp/merit/img_n/ico_madoguchi03.png) no-repeat 10px 50% / 41px 41px;
}
.madoguchi_h3.no4 {
  background: url(/sp/merit/img_n/ico_madoguchi04.png) no-repeat 10px 50% / 41px 41px;
}

.madoguchi_contents {
  margin: 0 10px;
}
.madoguchi_contents p span{
  color: #f76e9a;
}

.trouble_box{
  overflow: hidden;
}
.trouble_box dt{
  float: left;
  width: 30%;
}
.trouble_box dd{
  float: right;
  width: 70%;
  font-size: 11px;
}
.trouble_box dd span{
  line-height: 1.4;
  display: inline-block;
  margin-bottom: 3px;
}
.madoguchi_h4 .arrow {
  display:inline-block;
  height:8px;
  background-color:#ffd6de;
  position:relative;
  top:8px;
}

.madoguchi_h4 .arrow:before {
  position:absolute;
  content:"";
  width:0;
  height:0;
  border:4px solid transparent;
  border-left:4px solid #ffd6de;
  right:-8px;
}
.madoguchi_h4 .arrow2 {
  display:inline-block;
  height:8px;
  background-color:#ffd6de;
  position:relative;
  top:8px;
}

.madoguchi_h4 .arrow2:before {
  position:absolute;
  content:"";
  width:0;
  height:0;
  border:4px solid transparent;
  border-right:4px solid #ffd6de;
  left:-8px;
}
.madoguchi_h4 {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
}
.madoguchi_h4 .children {
  flex-grow: 1;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: #4d4d4d;
}
.madoguchi_h4 .children.text01 {
  margin: 0;
  padding: 0;
  display: inline;
  width: 120px;
}
.pink_list{
  border: 2px solid #ffd6de;
  border-radius: 5px;
  padding: 10px;
  margin-bottom: 10px;
  text-align: left;
}
.pink_list li{
}
.madoguchi_h5{
  font-weight: bold;
  font-size: 15px;
}
.madoguchi_contents .voice li{
  background: #fff6fa;
  padding: 10px;
  margin-bottom: 10px;
}
.madoguchi_contents .voice li:last-child{
  margin-bottom: 30px;
}
/*提携スクール一覧*/
/*タブ切り替え全体のスタイル*/
#school .tabs {
  margin-top: 15px!important;
  background-color: #fff;
  margin: 0 auto;
  width: 100%;
}

/*タブのスタイル*/
#school .tab_item {
  width: 31%;
  height: 40px;
  border-radius: 5px;
  line-height: 42px;
  font-size: 15px;
  text-align: center;
  color: #21b0e1;
  display: block;
  float: left;
  text-align: center;
  transition: all 0.2s ease;
  border-bottom:14px solid #21b0e1;
  border-top:1px solid #21b0e1;
  border-right:1px solid #21b0e1;
  border-left:1px solid #21b0e1;
  margin-right: 9px;
  position: relative;
  box-shadow: 0px 3px 3px -3px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0px 3px 3px -3px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 3px 3px -3px rgba(0,0,0,0.5);
}
#school .tab_item::after{
display: block;
content: "";
position: absolute;
right: 46%;
bottom: -8px;
width: 6px;
height: 6px;
margin: -4px 0 0 0;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
border-right: solid 2px #fff;
border-bottom: solid 2px #fff;

}

#school .tab_item.nom{
  margin-right: 0px;
  float: right;
}
#school .tab_item:hover {
  opacity: 0.75;
}


/*ラジオボタンを全て消す*/
#school input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
#school .tab_content {
  display: none;
  padding: 20px 0 0 0;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
#school .tabs input:checked + .tab_item {
  background-color: #21b0e1;
  border-bottom:14px solid #21b0e1;
  border-top:1px solid #21b0e1;
  border-right:1px solid #21b0e1;
  border-left:1px solid #21b0e1;
  color: #fff;
}
#school .tabs ul li{
  background: #f3f0f8;
  padding: 10px;
  margin-bottom: 15px;
}
#school .tabs ul li span{
  font-size: 17px;
  margin-bottom: 5px;
  display: block;
}
#school .h3_school{
  font-size: 20px;
  font-weight: bold;
  color: #4d4d4d;
  margin-bottom: 10px;
}

/*講座一覧*/
/*タブ切り替え全体のスタイル*/
#kouza .tabs {
margin-top: 15px!important;
  background-color: #fff;
  margin: 0 auto;
  width: 100%;
  position: relative;
}
.tab_in {
  border-bottom: 5px solid #8c6abb;
  height: 41px;
  padding: 0 10px;

}
.bar{
  height: 5px;
  width: 100%;
  position: absolute;
  background: #8c6abb;
  top:40px;
  left: 0;
}

/*タブのスタイル*/
#kouza .tab_item {
  width: 46.5%;
  height: 40px;
  line-height: 44px;
  font-size: 15px;
  text-align: center;
  color: #fff;
  display: block;
  float: left;
  text-align: center;
  transition: all 0.2s ease;
  margin-right: 0px;
  margin-left: 10px;
  position: relative;
  background: #baa6d6;
  border-bottom: 1px solid #baa6d6;
}

#kouza .tab_item.nom{
  margin-right: 10px;
  margin-left: 0px;
  float: right;
}
#kouza .tab_item:hover {
}


/*ラジオボタンを全て消す*/
#kouza input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
#kouza .tab_content {
  display: none;
  padding: 20px 0 0 0;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
#kouza .tabs input:checked + .tab_item {
  color: #fff;
  background: #8c6abb;
}
#kouza .lineup{
  overflow: hidden;
  border-top: 1px dotted #ccc;
  margin: 20px 0 0;
}
#kouza .lineup li a{
  display: block;
  width: 49.5%;
  float: left;
  padding: 7px 0;
  text-align: center;
  border-bottom: 1px dotted #ccc;
  position: relative;
}
#kouza .lineup li a::after{
display: block;
content: "";
position: absolute;
right: 10px;
bottom: 50%;
width: 6px;
height: 6px;
margin: -4px 0 0 0;
-webkit-transform: rotate(45deg);
        transform: rotate(45deg);
border-right: solid 2px #21b0e1;
border-bottom: solid 2px #21b0e1;

}

#kouza .lineup li:nth-child(odd) a{
  border-right:1px solid #cfcfcf;
}

#kouza .lineup li a span{
  display: block;
  font-size: 12px;
}
#kouza .lineup .active{
  background: #e2f3fa;
}
#kouza .font_pink{
  color: #fb92b3;
  font-size: 13px;
}
.kouza_h4 .arrow {
  display:inline-block;
  height:8px;
  background-color:#f2e4f8;
  position:relative;
  top:8px;
}

.kouza_h4 .arrow:before {
  position:absolute;
  content:"";
  width:0;
  height:0;
  border:4px solid transparent;
  border-left:4px solid #f2e4f8;
  right:-8px;
}
.kouza_h4 .arrow2 {
  display:inline-block;
  height:8px;
  background-color:#f2e4f8;
  position:relative;
  top:8px;
}

.kouza_h4 .arrow2:before {
  position:absolute;
  content:"";
  width:0;
  height:0;
  border:4px solid transparent;
  border-right:4px solid #f2e4f8;
  left:-8px;
}
.kouza_h4 {
  display: flex;
  align-items: flex-start;
  margin: 40px 0 10px;
}
.kouza_h4 .children {
  flex-grow: 1;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: #4d4d4d;
}
.kouza_h4 .children.text01 {
  margin: 0;
  padding: 0;
  display: inline;
  width: 120px;
}
.kouza_box{
  border: 2px solid #e2f3fa;
  border-radius: 5px;
}
.kouza_box .ttl{
  background: #e2f3fa;
  padding: 10px 70px 10px 18px;
  overflow: hidden;
  position: relative;
}
.kouza_box .ttl p {
  font-weight: bold;
  height: 2.8em;
  overflow: hidden;
  display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.kouza_box .ttl p.time{
  width: 60px;
  background: #fff;
  border-radius: 5px;
  text-align: center;
  padding: 4px 0 1px;
  position: absolute;
  top:8px;
  right: 8px;
  font-weight: normal;
}
.kouza_box .ttl p.license{
  font-size: 11px;
}
.kouza_box .ttl p.license span{
  font-size: 14px!important;
}

.kouza_box .ttl p.time span{
  display: block;
  color: #f92678;
}

.kouza_box .btn{
  text-align: center;
  color: #21b0e1;
  position: relative;
  padding: 10px;
  }
.kouza_box .btn::after {
  position: absolute;
  content: "";
  top: 11px;
  right: 24%;
  width: 15px;
  height: 15px;
  background: url(/sp/img_n/ico_datail_blue_plus.png) 50% 50% no-repeat;
  background-size: 15px 15px;
}
.kouza_box .btn.add::after {
  position: absolute;
  content: "";
  top: 11px;
  right: 24%;
  width: 15px;
  height: 15px;
  background: url(/sp/img_n/ico_datail_blue_minus.png) 50% 50% no-repeat;
  background-size: 15px 15px;
}
.reco_kouza{
  margin: 30px 10px 0;
  text-align: center;
}
.reco_kouza div{
  background: #8c6abb;
  border-radius: 5px;
  color: #fff;
  font-weight: bold;
  font-size: 15px;
  padding: 3px 0 1px;
  margin-bottom: 10px;
}
.reco_kouza p{
  color: #8c6abb;
}
.reco_kouza dl{
  margin-top: 15px;
}
.reco_kouza dt{
  background: #f3f0f8;
  border-radius: 5px;
  color: #8c6abb;
  font-weight: bold;
  padding: 5px 0 4px;
  margin-bottom: 10px;
}
.reco_kouza dd{
  margin: 0!important;
}
.reco_kouza dd::after{
  display: block;
  text-align: center!important;
  margin: 5px auto;
  width: 0;
  height: 0;
  content: '';
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 9px solid #8c6abb;
}
.font-purple{
  color: #8c69bc;
  font-weight: bold;
}
#kouza .lineup .lineup_btn.nondata {
  height: 2.6em;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#kouza .lineup .lineup_btn.nondata::after {
  content: none;
}