/* Scss Document */
/* color */
/* media queries*/
.red {
  color: #ff0004;
}

/*========== common ==========*/
.inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
}

.colum_down {
  display: inline-block;
}

.under_line {
  text-decoration: underline;
}

#titleback {
  margin: 0 auto;
  padding: 0;
  width: 100%;
  height: 200px;
}

#titleback .inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
}

#titleback .inner h2 {
  position: absolute;
  top: 8rem;
  left: 2rem;
  color: #fff;
  font-size: 2rem;
  letter-spacing: 10px;
}

@media screen and (max-width: 640px) {
  #titleback .inner h2 {
    top: 6.5rem;
    left: 1.5rem;
  }
}

#titleback .inner .dark {
  color: #47463b;
}

@media screen and (min-width: 641px) {
  #titleback .inner br {
    display: none;
  }
}

#titleback .inner .text_shadow {
  text-shadow: 0 0 10px #47463b;
}


.materials_text {
		margin: 0 1rem 1rem 1rem;
}
.materials_text p {
		font-size: 1rem;
}

.materials_dl {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin: 0;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
}
.materials_dl .inbox {
		padding: 1rem;
		width: 100%;
}
.materials_dl .inbox p {
		margin-bottom: 1rem;
		text-align: left;
}
.materials_dl .inbox p.small {
		font-size: 1rem;
		text-align: left;
}
.materials_dl .inbox:nth-of-type(2) {
		text-align: center;
}
.materials_dl .inbox img {
		width: 80%;
		-webkit-filter: drop-shadow(0px 0px 7px rgba(0, 0, 0, 0.6));
		        filter: drop-shadow(0px 0px 7px rgba(0, 0, 0, 0.6));
		margin: 0 10%;
}
@media screen and (max-width: 767px) {
		.materials_dl .inbox img {
				width: 80%;
		}
}
@media screen and (max-width: 767px) {
		.materials_dl {
				display: block;
		}
}

.materials_dl_btn {
		background-color: #F3DE28;
		position: relative;
		padding: 0;
		text-align: center;
}
@media screen and (max-width: 640px) {
		.materials_dl_btn {
				margin: 0.5rem 0;
		}
}
.materials_dl_btn .item {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
}
.materials_dl_btn .item .img {
		-ms-flex-preferred-size: 25%;
		    flex-basis: 25%;
}
.materials_dl_btn .item .text {
		padding: 0 0.5rem;
}
.materials_dl_btn img {
		width: 4.5rem !important;
		margin: 0 1.5rem 0 0;
		-webkit-filter: none !important;
		        filter: none !important;
}
.materials_dl_btn a {
		display: block;
		width: 100%;
		padding: 1rem 0.5rem;
}
@media screen and (max-width: 480px) {
		.materials_dl_btn a {
				padding: 0.5rem;
		}
}
.materials_dl_btn a:hover {
		background: rgba(71, 70, 59, 0.5);
		text-decoration: none;
		color: #fff;
}
.materials_dl_btn a:hover img {
		-webkit-filter: invert(100%) !important;
		        filter: invert(100%) !important;
}

/* 各ヘッダー */
.advantage_head {
  background: url("../img/advantage_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.service_head {
  background: url("../img/service_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.outsorcing_head {
  background: url("../img/outsorcing_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.it-solution_head {
  background: url("../img/it-solution_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.logistics_head {
  background: url("../img/logistics_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.salesforce_head {
  background: url("../img/salesforce_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.salesforce-intro_head {
  background: url("../img/salesforce-intro_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.deliver_head {
  background: url("../img/deliver_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.payroll_head {
  background: url("../img/payroll_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.online-assistant_head {
  background: url("../img/online-assistant_head_bg.jpg") no-repeat;
  background-position: 30% top;
  background-size: cover;
}

@media screen and (max-width: 767px) {
  .online-assistant_head {
    background: url("../img/online-assistant_head_sp_bg.jpg") no-repeat;
    background-position: 30% top;
  }
}

.seikyu-service_head {
  background: url("../img/seikyu-service_head_bg.jpg") no-repeat;
  background-position: 10% top;
  background-size: cover;
}

@media screen and (max-width: 767px) {
  .seikyu-service_head {
    background: url("../img/seikyu-service_head_sp_bg.jpg") no-repeat;
    background-position: 18% top;
  }
}

@media screen and (max-width: 640px) {
  .seikyu-service_head {
    background: url("../img/seikyu-service_head_sp_bg.jpg") no-repeat;
    background-position: 16% top;
  }
}

.nencho_head {
  background: url("../img/nencho_head_bg_pc.jpg") no-repeat;
  background-position: 20% top;
  background-size: cover;
}

@media screen and (max-width: 767px) {
  .nencho_head {
    background: url("../img/nencho_head_bg_sp.jpg") no-repeat;
    background-position: 18% top;
  }
}

@media screen and (max-width: 640px) {
  .nencho_head {
    background: url("../img/nencho_head_bg_sp.jpg") no-repeat;
    background-position: 15% top;
  }
}

@media screen and (max-width: 480px) {
  .nencho_head {
    background: url("../img/nencho_head_bg_sp.jpg") no-repeat;
    background-position: 12% top;
  }
}

.faq_head {
  background: url("../img/faq_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.casestudies_head {
  background: url("../img/casestudies_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.problems_head {
  background: url("../img/problems_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.rpa_head {
  background: url("../img/rpa_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.scanning_head {
  background: url("../img/scanning_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.subscription_head {
  background: url("../img/subscription_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.dx-bpo_head {
  background: url("../img/dx-bpo_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.kitting_head {
  background: url("../img/kitting_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.cloudsign_head {
  background: url("../img/cloudsign_head_bg.jpg") no-repeat;
  background-position: top center;
  background-size: cover;
}

.callcenter_head {
  background: url("../img/callcenter_head_bg.jpg") no-repeat;
  background-position: 65% top;
  background-size: cover;
}

.security-policy_head {
  background: url("../img/security-policy_head_bg.jpg") no-repeat;
  background-position: 65% top;
  background-size: cover;
}

.system-setting_head {
  background: url("../img/system-setting_head_bg.jpg") no-repeat;
  background-position: 65% top;
  background-size: cover;
}

.personal-information_head {
  background: url("../img/personal-information_head_bg.jpg") no-repeat;
  background-position: 65% top;
  background-size: cover;
}

.invoice_head {
  background: url("../img/invoice_head_bg.jpg") no-repeat;
  background-position: 65% top;
  background-size: cover;
}

.main_text {
  padding: 2rem 1rem 4rem 1rem;
  margin: -1rem;
}

.main_text .main_title {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin: 0 0 2rem 0;
}

@media screen and (max-width: 767px) {
  .main_text .main_title {
    font-size: 1.5rem;
  }
}

.main_text p {
  margin: 0 2rem;
  font-size: 1.2rem;
}

@media screen and (max-width: 767px) {
  .main_text p {
    margin: 0 1rem;
    font-size: 1rem;
  }
}

.bg_line {
  font-weight: bold;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(0%, #f3de28));
  background: linear-gradient(transparent 70%, #f3de28 0%);
  display: inline;
  padding: 0;
}

.bg_line_orange {
		font-weight: bold;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(0%, #f26628));
		background: linear-gradient(transparent 70%, #f26628 0%);
		display: inline;
		padding: 0;
}

.link_more {
  margin: 0 0.5rem 0.5rem 0.5rem;
  text-align: right;
  clear: both;
  background: url("../img/link_more.png") no-repeat right;
}

.link_more a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0 3rem 0 0;
}

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

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

.info_bt {
  text-align: center;
  border-bottom: none !important;
}

.info_btn {
  margin: 3rem 5%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media screen and (max-width: 640px) {
  .info_btn {
    display: block;
  }
}

.info_btn .common_btn {
  background-color: #F3DE28;
  position: relative;
  width: 100%;
  padding: 0;
  text-align: center;
  margin: 0 0.5rem;
}

@media screen and (max-width: 640px) {
  .info_btn .common_btn {
    margin: 0.5rem 0;
  }
}

.info_btn .common_btn img {
  width: 20%;
  margin: 0 1.5rem 0 0;
}

.info_btn .common_btn a {
  display: block;
  width: 100%;
  padding: 1rem 0.5rem;
}

@media screen and (max-width: 480px) {
  .info_btn .common_btn a {
    padding: 0.5rem;
  }
}

.info_btn .common_btn a:hover {
  background: rgba(71, 70, 59, 0.5);
  text-decoration: none;
  color: #fff;
}

.info_btn .common_btn a:hover img {
  -webkit-filter: invert(100%);
  filter: invert(100%);
}

/*========== end common ==========*/