@charset "utf-8";
/* CSS Document */

/* 目次 
 * 1. リセット
 * 2. 共通（レイアウト・見出し・その他・パンくず・header・mailform・戻るボタン・footer）　　・ハンバーガー・btn・
 * 3. TOP
 * 4. 下層共通事項（レイアウト・見出し・btn）
 * 5. 事業詳細の共通
 * 6. ITサポートページ//it-support/
 * 7.  /support//ses//government/
 * 8. 会社情報//company/
 * 9. 事業一覧//l/business/index.html
 * 10.採用一覧//recruit/index.html
 * 11.採用エントリー　//entry　採用サンクス entry-thanks
 * 12.お問い合わせ　//contact
 * 13.お問い合わせ完了　thanks/ 404 notfound
 * 14. 職種ページ　 #occupation
 * 15. サイトマップ //sistemap/スマホのみ
 * 16. 個人情報保護　//privacy_policy
 * 17. 古物営業法　/kobutsu
*/

@media screen and (max-width:1024px) {
/*--------------------------------------------------
3 top
---------------------------------------------------*/
.oth-fl2 {
    float: left;
    width: calc((100% - 85px * 1) / 2);
    margin-right: 85px;
    height: 740px;
	}

.bnr-fl2:nth-of-type(1) {
    float: left;
    width: calc((100% - 65px * 1) / 2);
    margin-right: 65px;
}
.bnr-fl2:nth-of-type(2) {
    float: left;
     width: calc((100% - 65px * 1) / 2);
}
	/*--------------------------------------------------
2 共通　footer
---------------------------------------------------*/
#footer #toTop img{
	width: 6%;
}

/**************************************************
/* BPOセンター　#bpo　max-width:1024px
***************************************************/
#bpo .inner {
    padding: 0 10px;
}
#bpo .flex-box {
    width: 100%;
}
#bpo h2.title {
    font-size: 24px;
    font-size: 2.4rem;
}
#bpo .para01:last-child {
    margin-right: auto;
}
/*BPOトップ mv*/
#bpo .bpo-mv {
    width: 100%;
}
#bpo .bpo-mv .flex-box {
    height: 100%;
    width: 100%;
}
#bpo .bpo-mv .ope img {
    top: 37px;
    left: 0;
}
#bpo .bpo-mv .gra-box {
    width: 100%;
    padding: 16px 16px;
}
#bpo .bpo-mv .gra-box p {
    font-size: 16px;
}
#bpo .bpo-mv .gra-box span.l-large {
    font-size: 23px;
}
#bpo .bpo-mv .gra-box span.large {
    font-size: 21px;
}

/*BPOトップ #nayami　max-width:1024px*/
#bpo #nayami .child {
    width: 48%;
}
#bpo #nayami .triangle {
    width: 50%;
    max-width: 240px;
    margin: 0 auto;
}
#bpo #nayami .Offer-list li img {
    max-width: 90px;
}
#bpo #nayami h2.title span {
    background-position-y: 40px;
    background-position-x: center;
    padding-bottom: 24px;
    display: block;
}
#bpo #nayami .btn {
    padding: 8px 0 20px;
    text-align: center;
}
/*BPOトップ #clear max-width:1024px*/
#bpo #clear {
    width: 100%;
}
#bpo #clear .fukidashi {
    width: 70%;
}
#bpo #clear .fukidashi h4,#bpo #clear .fukidashi p {
    line-height: 1.6;
}
#bpo #clear .text-box p {
    line-height: 1.4;
}
#bpo #nayami .btn a {
    width: 90%;
}
/*下層と共通*/
#bpo #menu {
    margin-top: 40px;
}
#bpo #menu .img-box {
    width: auto;
    margin-right: 0;
}
#bpo #menu .img-box img {
    margin-top: 0;
    height: auto;
    max-width: 360px;
}
#bpo #contactbox h2 {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo #contactbox {
    height: 100%;
    width: 94%;
}
#bpo #contactbox .btn a {
    width: 90%;
    padding: 20px 0;
    font-size: 16px;
    font-size: 1.6rem;
}
#bpo #contactbox .f-contactbox .telbox .tel {
    margin-right: -28px;
}
#bpo #contactbox p {
    line-height: 1.4;
}
/*BPO下層ページ MV*/
#bpo.bpo-btm .bpo-mv .person img {
    z-index: 1;
    width: 65%;
    max-width: 280px;
}
/*BPO下層ページ #clear*/
#bpo.bpo-btm #clear h3.title {
    width: 80%;
}
#bpo.bpo-btm #clear h2.title {
    margin: 40px auto 24px;
}
#bpo.bpo-btm #clear p {
    line-height: 1.8;
    margin: auto;
}
#bpo.bpo-btm #clear .color {
    line-height: 1.8;
}
#bpo.bpo-btm #clear.inner {
    width: 100%;
}
/*BPO下層ページ #case*/
#bpo.bpo-btm #case {
    margin-top: 16px;
}
#bpo.bpo-btm #case .bdr-box {
    height: 270px;
}
#bpo.bpo-btm #case .box {
    max-width: 483px;
}
#bpo.bpo-btm #case .title-img img {
    max-width: 70px;
}
#bpo.bpo-btm #case h2 {
    font-size: 17px;
    font-size: 1.7rem;
}
#bpo.bpo-btm #case .box p {
    line-height: 1.6;
}
#bpo.bpo-btm #production .flex-box .child {
    max-width: 299px;
    margin-right: 20px;
}
/*BPO下層ページ #example*/
#bpo.bpo-btm #example .flex-box .child {
    max-width: 313px;
    margin-right: 20px;
}
#bpo.bpo-btm #example .flex-box .child:nth-of-type(3n) {
    margin-right: 0;
    margin-left: auto;
}
/*------------------------------
#bpo 料金 max-width:1024px
------------------------------*/
#bpo.bpo-btm.price #price-list .flex-box .child {
    width: 31.8%;
    max-width: unset;
    margin-right: 22px;
}
#bpo.bpo-btm.price #price-list .note {
    white-space:normal;
  }
/*------------------------------
#itbu あなたのIT部 max-width:1024px
------------------------------*/
#itbu .inner {
    padding: 0 10px;
}
#itbu .flex-box {
    width: 100%;
}
/*トップ mv*/
#itbu .it-mv .flex-box {
    height: 100%;
    width: 100%;
}
#itbu .it-mv .ope img {
    top: 0;
    left: 0;
}
#itbu .it-mv .gra-box {
    width: 100%;
    padding: 16px 16px;
}
#itbu .it-mv .gra-box p {
    font-size: 16px;
}
#itbu .it-mv .gra-box span.l-large {
    font-size: 23px;
}
#itbu .it-mv .gra-box span.large {
    font-size: 21px;
}
#itbu #help-desk .flex-box .child {
    width: 33.3333%;
    max-width: 310px;
    margin-right: 25px;
}
#itbu #nayami {
    margin-top: 80px;
}
#itbu #clear .fukidashi {
    margin-left: auto;
    margin-right: auto;
}
#itbu #clear .flex-box {
    width: 910px;
 }
#itbu #it-case .flex-box .child {
    width: 48%;
}
#itbu #it-feature .flex-box {
    width: auto;
}
#itbu #menu {
    margin-top: 40px;
}
#itbu #menu .img-box {
    width: auto;
}
#itbu #menu .img-box img {
    margin-top: 0;
    max-width: 300px;
    height: auto;
}
#itbu #contactbox h2 {
    font-size: 20px;
    font-size: 2.0rem;
}
#itbu #contactbox {
    height: 100%;
    width: 94%;
}
#itbu #contactbox .btn a {
    width: 90%;
    padding: 20px 0;
    font-size: 16px;
    font-size: 1.6rem;
}
#itbu #contactbox .f-contactbox .telbox .tel {
    margin-right: -28px;
}
#itbu #contactbox p {
    line-height: 1.4;
}
#itbu #price-list .flex-box .child {
    width: 31.8%;
    max-width: unset;
    margin-right: 22px;
}


}

@media screen and (max-width:768px) {
/**************************************************
/* 2. 共通（レイアウト・見出し・その他・table・header・footer・ハンバーガー・btn・戻るボタン・footer
***************************************************/
.pc {display: none;}
.sp {display: block;}
.pc-br {display: none;}
.sp-br {display: block;}
#container {
    width: 100%;
    overflow: hidden;
}
.inner {
	width: 100%;
	padding: 0 10px;
}
img {
	width: 100%;
	height: auto;
	max-width: 100%;
}
#content {
    width: 100%;
    padding-bottom: 2%;
	}
/*--------------------------------------------------
見出し h1-h6 ※変更不可
----------------------------------------------------*/
h1,h2,h3,h4,h5,h6{
    font-weight:normal;
 line-height: 2;
}
h1 {
	font-size: 16px;
	font-size: 1.6rem;
	line-height:1.7;
}
h2 {
	font-size:22px;
	font-size: 2.2rem;
	text-align: left;
	line-height: 1.3;
}
h3 {
	font-size: 18px;
	font-size: 1.8rem;
	line-height: 1.3;
}
h4 {
	font-size: 16px;
	font-size: 1.6rem;
}
h5 {
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: normal;
}
p {
	font-size: 15px;
	font-size: 1.5rem;
	line-height:1.7;
	line-height: 2;
}
p.w100{
	line-height:1.0;
}
dt,dd,li{
	font-size: 15px;
	font-size: 1.5rem;
	line-height:1.7;
}
th,td{
	font-size: 15px;
	font-size: 1.5rem;
	line-height:1.7;
}
/*--------------------------------------------------
ぱんくず
----------------------------------------------------*/
nav#breadcrumbs ul{
	width: 100%;
	margin: 0 auto;
}
/*-------------------------------------------------
ヘッダー
---------------------------------------------------*/
#header {
	overflow:inherit;
	padding: 10px;
	height: 65px;
}
#header .logo {
	padding-top: 0;
	margin-left: 0;
}
.hamburger__icon{
	display: block!important;
	
}
.hamburger:after {
    content: 'MENU';
    font-size: 90%;
   color: #E4A100;
    top: 40px;
    position: absolute;
    font-weight: bold;
}
/*--------------------------------------------------
mailform 共通
----------------------------------------------------*/
#mailform .txt-r {
    padding-right: 5%;
}
/*--------------------------------------------------
戻るボタン
----------------------------------------------------*/
#pageTop {
    top: -24px;
}
/*--------------------------------------------------
footer
----------------------------------------------------*/
	#footer .sp-sitemap{
		margin: 5% auto;
		text-align: center;
	}
	#footer .sp-sitemap a{
		border-bottom: 1px solid #313131;
	}
.copyright small {
    color: #33383f;
    font-size: 10px;
    font-size: 1.0rem;
}
#footer #toTop img{
	width: 10%;
}
#footer .pm img{
	width: auto;
	}

/**************************************************
/* 3. TOP /
***************************************************/
#top #content {
    background: #fff;
padding-top: 8%;
}
#top .content,
#top .top-rec{
    width: 100%;
    padding: 4% 0px 4%;
}
#slider{
	width: 100%;
}
#slider li{
	height: 360px;
	background:center / cover no-repeat;
	background-attachment: scroll;
}
#top-mainvisual {
    width: 100%;
}
#top-mainvisual p {
    font-size: 16px;
    font-size: 1.6rem;
    margin: 0 auto;
    max-width: 95%;
		width: 100%;
    background-size: 100%;
		right: 10px;
    line-height: 29px;
		z-index: 3000;
}
	#top .lead {
    margin-bottom: 40px;
		font-size: 27px;
    font-size: 2.7rem;
	}
	.ser-fl2 {
    float: left;
    width: calc((100% - 20px * 1) / 2);
    margin-right: 20px;
    margin-bottom: 19px;
}
	.ser-fl2:nth-of-type(1) div {
    padding: 0px; 
}
	.com-fl2 {
    float: left;
    width: calc((100% - 20px * 1) / 2);
    margin-right: 20px;
}
	.com-fl2 .com-fl2-in-01:nth-of-type(1) {
    margin-bottom: 48px;
}
.bnr-fl2-in-01, .bnr-fl2-in-02, .bnr-fl2-in-03 {
    /* max-width: 50%; */
    /* width: 100%; */
    /* margin: 0 auto 40px; */
    /* float: none; */
}
	.bnr {
		width: 100%;
    padding: 10% 0px 8%;
    height: auto;
}
.bnr .inner a {
    width: 49.4%;
    margin-bottom: 8px;
    margin-right: auto;
    margin-left: auto;
    display: inline-block;
}
	.top-info {
    height: auto;
}
.top-info h2 {
    line-height: 20px;
    padding: 20px 30px;
}
	.top-info ul {
    padding: 20px 20px;
		height: auto;
	}
.top-info ul li:first-child {
    margin: 0px auto 15px;
}
	.top-info ul li {
    margin: 15px auto;
	}
	.top-info ul li:last-child {
    margin: 15px auto 0px;
}
/**************************************************
/* 4. 下層共通事項（レイアウト・見出し・header・nav・パンくず）
***************************************************/
/*--------------------------------------------------
下層レイアウト ※変更不可
----------------------------------------------------*/
.content {
    width: 100%;
    padding: 10% 0px;
}
 .content:last-child {
    padding: 10% 0px 0px;
}
	#busi-pages .busi-pages-img {
    margin: 25px auto 20px;
}
	.chap_block {
    padding-top: 0px;
    margin-top: 0;
	}
/*--------------------------------------------------
下層見出し h1-h6 ※変更不可
----------------------------------------------------*/
	.pages .pgs_ttl span {
    background-size: contain;
}
	.pages .pgs_ttl span::after {
    border-bottom: none;
}
.chap_block_main h2.lead {
    margin-bottom: 8%;
	font-size: 24px;
    font-size: 2.4rem;
}
.chap_block h2.lead {
    margin-bottom: 5%;
	font-size: 21px;
    font-size: 2.1rem;
}
.chap_block_main h2.lead span {
    margin-top: 8%;
	font-size: 21px;
    font-size: 2.1rem;
}
.chap_block_main h3.lead {
	font-size: 24px;
    font-size: 2.4rem;
	margin-bottom: 8%;
}
.chap_block p.lead-txt {
    margin-bottom: 15%;
}
#melit .chap_block p.lead-txt {
    margin-bottom: 5%;
}
/*--------------------------------------------------
下層パンくず
----------------------------------------------------*/
/*--------------------------------------------------
.pages共通
----------------------------------------------------*/
.pages .pgs_ttl {
    height: auto;
    padding: 10% 0px;
	  font-size: 27px;
    font-size: 2.7rem;
}
.pages .pgs_ttl span {
    margin-top: 1%;
}
.pages dl {
    padding: 0px 0% 20px;
}
.pages dl:last-child {
	margin-bottom: 30px;
}
.pages dt {
    display: block;
    width: 100%;
    padding: 6px 10px;
    line-height: 3;
    border-right: none;
	}
.pages dd {
    display: block;
    padding: 10px;
}
	iframe{
		width: 100%;
	}
/**************************************************
/* 8. 会社情報/ /company/
***************************************************/
#about .chap_block h2.lead {
	margin-bottom: 8%;
}
#about-form p.lead-txt {
    margin-bottom: 8%;
}
#mess{
	width:100%;
	padding: 10% 0 0;
}
#mess .message,
#guidelines .guide-para,
#csr .para02,
#map .map-para{
	display: block;	
}
#mess .message{
align-items: flex-end;
}
#mess .message .daihyo{
		text-align: center;
	}	
#mess .message .daihyo img{
		width: auto;
}
#mess .mess p{
	margin-bottom: 17px;
}
#mess .mess p:nth-child(1){
	width:100%;
}
#mess .mess p:nth-child(2){
	width:100%;
}
#mess .mess p:nth-child(3){
	width:100%;
}	
#guidelines .guide-txt{
	width: 98%;
 font-size: 1.4rem;
 font-size: 14px;
}
#guidelines .para01{
	width: 100%;
	text-align: center;
}
#csr .para02 {
  flex-basis: 50%;
	margin-top: 5%;
  margin-bottom: 3%;
	text-align: center;
	}
	#csr .para02:nth-child(2n+1){
		margin-right: 20px;
	}
#csr .csr-nest01 img{
	width: 50%;
	margin-right: 0;
}
	#csr .csr-nest02 h3{
		margin-top: 15px;
		text-align: left;
	}
	#csr .csr-nest02 p{
		font-size: 2.5vmin;
		text-align: left;
	}
	#map .para03 h3 {
		font-weight: bold;
	}
/**************************************************
/* 9. 事業一覧 business
***************************************************/
#business .busi-para{
	display: flex;
	justify-content:flex-start;
	}
#business .busi-para {
    margin-top: 25px;
}
#business .para01{
	max-width: 450px;
	width: 49%;
	text-align: center;
	 margin-right: 20px;
  margin-bottom: 20px;
}
#business .para01 p {
    height: auto;
	  margin-bottom: 20px;
}
div.btn-box a.btn02 {
  width: 100%;
	padding: 6%;
	}
/**************************************************
/* 5. 事業詳細の共通
***************************************************/
	#busi-pages .busi-con {
    flex-basis: 45%;
    margin-right: 30px;
    margin-bottom: 30px;
}
	#busi-pages h3.busi-sub-ttl {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.7;
   	padding:3%;
}
/**************************************************
/* 7. /support//ses//government/
***************************************************/
#support .busi-con {
    flex-basis: 100%;
}
#support p.lead-ttl {
    margin-bottom: 20px;
}
	#support p.lead {
    margin-bottom: 20px;
}
/**************************************************
/* 12. /contact/
***************************************************/
#contact .chap_block_main p.lead-txt {
    margin-bottom: 8%;
}
	#content #mailform table {
    width: 100%;
    margin: 0 auto 20px;
	}
#contact td{
		font-size: 3vmin;
	}	
#mailform th {
    width: 100%;
}
#mailform td {
  width: 100%;
	height: 80px;
}
#mailform th.txt-top {
    vertical-align: top;
    padding-top: 10px;
}
.checkbox01-parts {
    line-height: 1.5;
}
.checkbox01-parts::before {
    position: absolute;
    top: 0px;
    left: 0;
}
#contact .checkbox01-parts::before {
    position: absolute;
    top: -1px;
    left: 0;
}
#contact #mailform .privacy {
    padding: 15% 0px 10%;
}
	#contact #mailform .privacy td{
		height: 90px;
		padding: 15px ;
	}
#mailform .txt-r .checkbox01-parts::before {
    position: absolute;
    top: 3px;
    left: 0;
}
#contact #mailform th.txt-top {
    vertical-align: top;
	padding-top: 10px;
}
#contact .checkbox01 {
    margin-bottom: 0px;
    margin-top: 0px;
}
#contact .checkbox02 {
    margin-top: -15px;
}
#contact .checkbox01-input:checked + .checkbox01-parts::after {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    left: 5px;
    width: 7px;
    height: 14px;
    transform: rotate(40deg);
    border-bottom: 3px solid #676767;
    border-right: 3px solid #676767;
}
#submit {
    margin: 10px auto 20px;
	}
	#submit .btn02 {
    width: 90%;
	}
/**************************************************
/* 16. 個人情報保護方針 /privacy/
***************************************************/
.inner.pp{
		padding: 10% 10px 0;
	}
.pp01{
	margin: 0 0 35px;
}
#privacy .lead-txt {
    margin: 10% 0px 30px;
}
/*--------------------------------------------------
.pri-table .table03
----------------------------------------------------*/
.pri-table {
    margin: 20px 0px 10px;
    width: 100%;
}
/**************************************************
/* 17. 古物営業法　/kobutsu
***************************************************/
#kobutsu .kobu-list dl {
    padding: 0px;
}
#kobutsu .kobu-list dt{
	  width: 100%;
    padding: 16px 10px;
	line-height: 16px;
}
#kobutsu .kobu-list dd {
  padding: 16px 10px;
	line-height: 16px;
}
/**************************************************
/* 10. 採用一覧
***************************************************/
#careers .mess {
    width: 100%;
}
	#careers .message {
    margin-top: 10px;
    align-items: flex-start;
    width: 100%;
}
.chap_block_main p.lead-txt{
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.6;
}
.red-txt {
    font-size: 20px;
    font-size: 2.0rem;
	}
.green-txt {
    font-size: 18px;
    font-size: 1.8rem;
	}
#careers #mess p.lead {
  font-size: 16px;
  font-size: 1.6rem;
}
	#careers #occupation-list table {
    width: 90%;
		display: table;
}
#careers #occupation-list table th {
		padding: 5% 3%;
    width: 106px;
    display: table-cell;
}
#careers #occupation-list table td {
	display: table-cell;
	width: 85%;
	margin-top: -1px;
	margin-bottom: -1px;
}
	#careers #occupation-list #tab li {
  font-size: 14px;
  font-size: 1.4rem;
}
.careers-flow p {
  font-size: 16px;
  font-size: 1.6rem;
	
}

/**************************************************
/* 11.採用エントリー　//entry　採用サンクス entry-thanks
***************************************************/
#entry	#mailform th {
    width: 100%;
}
#entry #mailform td {
    width: 100%;
    display: block;
    height: auto;
	padding: 3% 10px;
}	
#entry #submit .btn02 {
    width: 90%;
}

/*--------------------------------------------------
職種　＃occupation
----------------------------------------------------*/
	#occupation dt {
    display: block;
    width: 100%;
}

/*--------------------------------------------------
BPO max-width:768px
----------------------------------------------------*/
#bpo .inner {
    padding: 0 20px;
    width: 100%;
}
#bpo .flex-box {
    width: auto;
}
#bpo .child p, #bpo .Offer {
    margin-bottom: 6vh;
}
#bpo .bpo-mv .ope img {
    width: 99%;
}
#bpo .bpo-mv.pc {
    display: block;
}
#bpo .bpo-mv.sp {
    display: none;
}
/*#bpo #nayami*/
#bpo #nayami h2.title img {
    max-width: 540px;
}
#bpo #nayami .img-box img {
    top: 227px;
    max-width: 280px;
}
#bpo #nayami .flex-box {
    margin-top: 64px;
}
#bpo #nayami h2.title {
    position: relative;
    bottom: 16px;
}
#bpo #nayami .triangle {
    max-width: 180px;
}
#bpo #nayami .triangle img {
    bottom: -25px;
}
#bpo #nayami .child {
    margin-left: 0;
    height: 440px;
    margin-right: 0;
}
/*#bpo #clear*/
#bpo #clear .inner {
    max-width: unset;
}
#bpo #clear .flex-box {
    max-width: 700px;
    margin: 0 auto;
}
#bpo #menu .img-box img {
    margin-top: 0;
    height: auto;
    max-width:240px;
}
#bpo #menu {
    max-width: 730px;
}
#bpo #menu .box {
    width: 56%;
}
#bpo #contactbox .note {
    margin-top: 4px;
}
/*#bpo #line-box 768*/
#bpo #line-box .box {
    padding: 2% 10px;
    margin: 0 auto 20px;
}
#bpo #line-box .line-icon {
    margin: 0 auto;
}
#bpo #line-box .line-icon img {
    width: auto;
    margin: 10px auto 0;
}
#bpo #line-box p {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.4;
}
#bpo #line-box .box h2 {
    text-align: center;
    font-size: 22px;
    font-size: 2.2rem;
}
#bpo #line-box .img-box {
    display: none;
}
/*--------------------------------------------------
BPO下層ページ max-width:768px
----------------------------------------------------*/
#bpo.bpo-btm .flex-box .child {
    width: 32.3%;
    max-width: 256px;
    margin-right: 8px;
}
#bpo.bpo-btm .bpo-mv .person img {
    max-width: 280px;
    bottom: 56px;
    position: relative;
    margin-right: 0;
}
/*BPO下層ページ　#clear*/
#bpo.bpo-btm #clear {
    margin-top: 40px;
}
#bpo.bpo-btm #clear h2.title {
    margin: 24px auto 24px;
}
#bpo.bpo-btm #clear p {
    font-size: 17px;
    font-size: 1.7rem;
}
#bpo.bpo-btm #clear .text-box {
    max-width: 524px;
}
#bpo.bpo-btm #clear .img-box {
    width: 28%;
}
#bpo.bpo-btm #clear h3.title {
    width: 90%;
}
#bpo.bpo-btm #clear h3.title .sp {
    display: none;
}
/*BPO下層ページ　#example*/
#bpo.bpo-btm #example h2 {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo.bpo-btm #example h3 {
    font-size: 17px;
    font-size: 1.7rem;
}
#bpo.bpo-btm #example ul li {
    text-indent: -1em;
    padding-left: 0.7em;
}
#bpo.bpo-btm #example ul li span {
    text-indent: 0;
    margin-left: 0;
}
#bpo.bpo-btm #example .flex-box .child {
    width: 32.3%;
    max-width: 256px;
    margin-right: 8px;
}
#bpo.bpo-btm #example .Offer {
    margin-bottom: 1vh;
}
/*BPO下層ページ　#case*/
#bpo.bpo-btm #case .box {
    max-width: unset;
    width: 49.0%;
}
#bpo.bpo-btm #case h2 {
    font-size: 16px;
    font-size: 1.6rem;
}
/*BPO下層ページ　#production*/
#bpo.bpo-btm #production .flex-box .child {
    width: 31.6%;
    max-width: unset;
    text-align: center;
    margin-right: 16px;
    margin-left: 0;
}
#bpo.bpo-btm #production .child p {
    font-size: 15px;
    font-size: 1.5rem;
    padding: 3% 1%;
    line-height: 1.5;
}
/*BPO下層ページ　料金*/
#bpo.bpo-btm.price #clear.inner {
    width: 96%;
}
#bpo.bpo-btm.price .bpo-mv {
    background-image: url(../images/bpo/bpo-mv-top.png);
    background-repeat: no-repeat;
    background-position-y: top;
    position: relative;
}
#bpo.bpo-btm.price #clear .fukidashi.pt01 {
    width: 100%;
}
#bpo.bpo-btm.price #clear .fukidashi.pt02 {
    width: 85%;
}
#bpo.bpo-btm.price .bpo-mv .person img {
    bottom: 0;
}
#bpo.bpo-btm.price #clear .img-box {
    width: 20%;
}
#bpo.bpo-btm.price #clear .box {
    width: 75%;
    margin-bottom: 56px;
}
#bpo.bpo-btm.price #clear .fukidashi.pt01::after {
    bottom: 0;
    top: 82%;
}
#bpo.bpo-btm.price .flex-box {
    display: flex;
}
#bpo.bpo-btm.price #price-list h3 {
    font-size: 26px;
    font-size: 2.0rem;
}
#bpo.bpo-btm.price #price-list .flex-box .child {
    width: 48%;
    margin-right: 16px;
}
#bpo.bpo-btm.price #price-list .flex-box .child:nth-of-type(2n) {
    margin-right: 0;
    margin-left: auto;
}
#bpo.bpo-btm.price #price-list .flex-box .child:nth-of-type(3n) {
    margin-right: 0;
    margin-left: 0;
}

/*--------------------------------------------------
IT部 max-width:768px
----------------------------------------------------*/
#itbu .inner {
    padding: 0 20px;
}
#itbu .flex-box {
    width: 100%;
}
#itbu .it-mv {
    width: 100%;
}
#itbu .it-mv.pc {
    display: block;
}
#itbu .it-mv.sp {
    display: none;
}
#itbu .it-mv .ope img {
    max-width: 450px;
    top: 30px;
}
#itbu #nayami {
    margin-top: 36px;
}
#itbu h2.title img {
    width: 90%;
    max-width: 640px;
}
#itbu #clear .flex-box {
    width: auto;
}
#itbu #clear h3.title .sp {
    display:none;
}
#itbu #clear .text-box p .sp {
    display:none;
}
/*#it-feature*/
#itbu #it-feature .dot-box {
    width: 100%;
}
#itbu #it-feature .flex-box .child {
    width: 47.8%;
    max-width: unset;
    text-align: center;
    margin-right: 27px;
    margin-bottom: 24px;
}
/*#itbu #it-case*/
#itbu #it-case h4 {
    font-size: 15px;
    font-size: 1.5rem;
}
#itbu #it-case .flex-box .child {
    width: 48.6%;
}
#itbu #it-case .flex-box span.img img {
    max-width: 73px;
}
/*#itbu .chokomaka*/
#itbu .chokomaka {
    margin: 40px auto;
}
#itbu .chokomaka h3.title .sp {
    display: none;
}
/*#itbu #help-desk*/
#itbu #help-desk .flex-box .child {
    width: 31.8%;
    max-width: unset;
    margin-right: 16px;
}
#itbu #help-desk h3 {
    font-size:18px;
    font-size:1.8rem;
}
#itbu #help-desk .Offer-list {
    padding: 16px 10px;
}
/*#itbu #it-image*/
#itbu #it-image h3 {
    height: 98px;
}
#itbu #it-image .flex-box .child {
    width: 48%;
    margin-right: 20px;
}
#itbu #it-image .arrow.sp {
    display: none;
}
#itbu #it-image .arrow.pc {
    display: block;
}
#itbu #it-image .arrow img {
    right: -69px;
}
/*#itbu 料金*/
#itbu #price-list h3 {
    font-size: 26px;
    font-size: 2.0rem;
}
#itbu #price-list .flex-box .child {
    width: 48%;
    margin-right: 16px;
}
#itbu #price-list .flex-box .child:nth-of-type(2n) {
    margin-right: 0;
    margin-left: auto;
}
#itbu #price-list .flex-box .child:nth-of-type(3n) {
    margin-right: 0;
    margin-left: 0;
}
/*#itbu #menu768*/
#itbu #menu .img-box img {
    margin-top: 0;
    max-width: 240px;
    height: auto;
}
#itbu #menu {
    max-width: 730px;
}
#itbu #contactbox .note {
    margin-top: 4px;
}
/*#itbu #line-box 768*/
#itbu #line-box .box {
    padding: 2% 10px;
    margin: 0 auto 20px;
}
#itbu #line-box .line-icon {
    margin: 0 auto;
}
#itbu #line-box .line-icon img {
    width: auto;
    margin: 10px auto 0;
}
#itbu #line-box p {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.4;
}
#itbu #line-box .box h2 {
    text-align: center;
    font-size: 22px;
    font-size: 2.2rem;
}
#itbu #line-box .img-box {
    display: none;
}

}

@media screen and (max-width:722px) {
.com-fl2 .com-fl2-in-01:nth-of-type(1) {
    margin-bottom: 40px;
}

}
@media screen and (max-width:638px) {
.com-fl2 .com-fl2-in-01:nth-of-type(1) {
    margin-bottom: 40px;
}
#footer #toTop img{
	width: 15%;
}

}

@media screen and (max-width:480px) {
/**************************************************
/* 共通（レイアウト・見出し・その他・パンくず・header・mailform・戻るボタン・footer）
***************************************************/
/*--------------------------------------------------
nav
----------------------------------------------------*/
.logo {
    width: 85%;
}	
	/*--------------------------------------------------
ぱんくず
----------------------------------------------------*/
	nav#breadcrumbs li {
    font-size: 11px;
	  font-size: 1.1rem;
}
	nav#breadcrumbs li a {
	font-size: 11px;
  font-size: 1.1rem;
}
/**************************************************
/* 3. TOP /
***************************************************/
		.com-fl2 .com-fl2-in-01:nth-of-type(1) {
    margin-bottom: 27px;
}
.bnr .inner a {
    width: 49.2%;
    margin-bottom: 8px;
}
/**************************************************
/* 9. 事業一覧 business
***************************************************/
#business .busi-para{
	display: block;
}	
#business .para01{
	width: 100%;
	text-align: center;
	 margin-right: 0;
  margin-bottom: 20px;
}
/**************************************************
/* 5. 事業詳細
***************************************************/
	/*--------------------------------------------------
.busi-pages　　共通
----------------------------------------------------*/
	#busi-pages div.btn-box a.btn02 {
    width: 100%;
    margin: 0 auto;
    padding: 6%;
	}
/**************************************************
/*  6. ITサポートページ//it-support/
***************************************************/	
#business .busi-para{
	display: block;
}
	#busi-pages .busi-con {
    flex-basis: 100%;
    margin-right: 0;
    margin-bottom: 20px;
}
/**************************************************
/* 10. 採用一覧
***************************************************/
#careers #mess p.lead {
  font-size: 15px;
  font-size: 1.5rem;
}
	#careers #occupation-list .employment {
  display: block;
	   width: 94%;
	}
#careers #occupation-list .employment li {
  width: 98%;
	margin: 0 auto;
	font-size: 2vmin;
}
#careers #occupation-list #tab li,
#careers #occupation-list #tab li.current{
  background-size: 5px;
  background-position: right 5px center;
  line-height: 1.2;
}
#careers #occupation-list #tab a{
	display: block;
	padding: 20px;
	line-height: 20px;
}
#careers #occupation-list table {
	display: block;
  width: 90%;
}
	#careers #occupation-list table th {
    width: 100%;
		display: block;
}
#careers #occupation-list table th,#careers #occupation-list table td {
  font-size: 14px;
  font-size: 1.4rem;
	display: block;
	 width: 100%;
}
#careers #occupation-list table td {
  padding-left: 1em;
}
#careers .flow {
  width: 90%;
}
.careers-flow p {
  font-size: 12px;
  font-size: 1.2rem;
}
.careers-flow .number {
  margin: 0 5px 0 5px;
}
.flow-txt {
  font-size: 14px;
  font-size: 1.4rem;
}
#careers #occupation-list .employment li {
  font-size: 14px;
  font-size: 1.4rem
}
#careers .mess {
     width: 100%; 
}
#careers .entry-btn a {
    padding: 6% 16%;
    background: #369625;
    color: #ffffff;
    transition: all .3s;
    display: block;
    width: 90%;
    margin: 0 auto;	
}
/**************************************************
/* BPO w480
************************** *************************/
#bpo .bpo-mv.pc {
    display: none;
}
#bpo .bpo-mv.sp {
    display: block;
}
#bpo h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo .child {
    width: 100%;
    margin-right: auto;
    margin: 0 auto;
}
#bpo .child p, #bpo .Offer {
    margin-bottom: 6vh;
}
/*悩みW480*/
#bpo #nayami .child:nth-child(even) {
    margin-right: auto;
    margin-left: 0;
}
#bpo #nayami .img-box img {
    width: 70%;
    max-width: 180px;
    top: 227px;
    margin: 70px 0 70px auto;
}
#bpo #nayami h2.title {
     bottom: 30px;
}
#bpo #nayami .triangle {
    width: 35%;
    bottom: -75px;
    position: relative;
}
#bpo #nayami .triangle img {
    bottom: -8px;
}
#bpo #nayami .child h3 {
    font-size: 18px;
    font-size: 1.8rem;
}
#bpo #nayami .child{
    width: 100%;
    height: auto;
    max-width: unset;
}
#bpo #nayami .btn a {
    width: 100%;
    padding: 20px 0;
}
/*#clear「あなたの～部」で解決！　2カラム*/
#bpo #clear {
    margin-top: 40px;
}
#bpo #clear h3.title {
    width: 60%;
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo #clear ul li {
    font-size: 13px;
    font-size: 1.3rem;
}
#bpo #clear h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo #clear h3.title span {
    position: relative;
    padding: 0 6%;
    display: inline-block;
}
#bpo #clear h3.title span.img:before {
    content: "ちょこっとおまかせ";
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    position: relative;
    top: -4px;
    right: 0;
}
#bpo #clear h3.title span img {
    max-width: 240px;
    width: 80%;
    margin: 0 auto;
    position: relative;
    left: auto;
    right: auto;
    padding-bottom: 4px;
    border-bottom: 7px solid#F8E182;
}
#bpo #clear h3.title span.border {
    border-bottom: 7px solid#F8E182;
}
#bpo #clear .fukidashi {
    height: auto;
    width: 100%;
}
#bpo #clear .fukidashi:after {
    position: absolute;
    bottom: -29px;
    top: auto;
    left: auto;
    right: 102px;
    width: 0;
    margin: 0 auto;
    height: 0;
    content: '';
    border-width: 33px 30px 0 1px;
    border-style: solid;
    border-color: #faedb8 transparent transparent transparent;
}
#bpo #clear .fukidashi h4.title{
    font-size: 15px;
    font-size: 1.5rem;
}
#bpo #clear .fukidashi p {
    font-size: 13px;
    font-size: 1.3rem;
}
#bpo #clear .flex-box {
    flex-direction: column-reverse;
    display: flex;
}
#bpo #clear .img-box {
    width: 32%;
    margin: 32px auto 0;
}
#bpo #menu .box {
    width: 100%;
}
#bpo #menu .img-box img {
    margin: 0 auto;
    display: block;
}
#bpo #menu .btn a {
    max-width: 360px;
    min-width: unset;
}
#bpo #contactbox {
    height: 100%;
    width: 90%;
    margin: 48px auto 2px;
}
#bpo #contactbox .f-contactbox .telbox, #bpo #contactbox .f-contactbox .conbox {
    width: 100%;
    margin: 32px auto;
}
#bpo #contactbox .flex-wrap {
    display: block;
}
#bpo #contactbox i {
    font-size: 40px;
    font-size: 4.0rem;
    margin-left: -43px;
    bottom: -4px;
}
#bpo #contactbox .f-contactbox .telbox .tel {
    margin-right: -38px;
}
/*#bpo #line-box W480*/
#bpo #line-box .box {
    text-align: left;
    margin-bottom: 20px;
    padding: 5% 10px;
    width: 100%;
}
/*------------------------------
#bpo BPO下層ページ W480
------------------------------*/
#bpo.bpo-btm .flex-box .child {
    width: 100%;
    margin-right: auto;
    margin: 0 auto;
    max-width: unset;
}
/*BPO 下層ページMV*/
#bpo.bpo-btm .bpo-mv {
    height: auto;
    background-image: unset;
}
#bpo.bpo-btm .bpo-mv::after {
    bottom: -30px;
}
#bpo.bpo-btm .bpo-mv .person img {
    bottom: -46px;
    position: absolute;
    width: 60%;
}
/*BPO 下層ページ#case*/
#bpo.bpo-btm #case {
    margin-top: 40px;
}
#bpo.bpo-btm #case .bdr-box {
    height: auto;
    max-width: unset;
}
#bpo.bpo-btm #case .box:nth-child(2) {
    margin-top: 24px;
}
#bpo.bpo-btm #case .box {
    margin-right: 0;
    width: 100%;
}
/*BPO 下層ページ#clear*/
#bpo.bpo-btm #clear h3.title {
    margin-right: auto;
    margin-left: auto;
    border-bottom: unset;
}
#bpo.bpo-btm #clear h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo.bpo-btm #clear h2.title::after {
    left: 30%;
}
#bpo.bpo-btm #clear .text-box {
    width: 100%;
}
#bpo.bpo-btm #clear .img-box {
    max-width: 240px;
    width: 50%;
    margin: 20px auto 50px;
}
#bpo.bpo-btm #example .flex-box .child {
    width: 100%;
    max-width: unset;
    margin-right: 0;
}
#bpo.bpo-btm #example h2 {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo.bpo-btm #production .flex-box .child {
    width: 100%;
}
#bpo.bpo-btm #production .flex-box .child {
    margin-right:0;
}
#bpo.bpo-btm #production h2 {
    line-height: unset;
    width: 80%;
    height: 48px;
    font-size: 18px;
    font-size: 1.8rem;
    margin: 0 auto;
    padding: 7px 1px;
}
#bpo.bpo-btm #production h3 {
    margin: 24px 0 16px;
    font-size: 15px;
    font-size: 1.5rem;
}
#bpo.bpo-btm #menu .img-box img {
    margin-top: 0;
}
/*BPO下層ページ地域事務*/
#bpo.bpo-btm.zimu .bpo-mv .person img {
    bottom: 0;
    position: absolute;
    width: 60%;
}
#bpo.bpo-btm.zimu #case {
    margin-top: 36px;
}
/*------------------------------
#BPO下層ページ 料金ページ W480
------------------------------*/
#bpo.bpo-btm.price #price-list .child h4 {
    font-size: 30px;
    font-size: 3.0rem;
}
#bpo.bpo-btm.price .bpo-mv .person img {
    max-width: 240px;
    right: 0;
    top: 52px;
    bottom: -100px;
}
#bpo.bpo-btm.price .mv-box h3.title {
    width: 65%;
}
#bpo.bpo-btm.price .mv-box h3.title span.img:before {
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    position: relative;
    top: -4px;
    right: 8px;
}
#bpo.bpo-btm.price .mv-box h3.title span {
    position: relative;
    padding: 0 6%;
    display: inline-block;
}
#bpo.bpo-btm.price .mv-box h3.title span.border {
    border-bottom: 7px solid#F8E182;
}
#bpo.bpo-btm.price .mv-box h3.title span img {
    max-width: 270px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    left: auto;
    right: auto;
    border-bottom: 7px solid#F8E182;
}
#bpo.bpo-btm.price .bpo-mv {
    height: 640px;
}
#bpo.bpo-btm.price .mv-box p {
    font-size: 18px;
    font-size: 1.8rem;
    text-align: left;
}
#bpo.bpo-btm.price #clear .fukidashi {
    margin-left: auto;
    margin-right: auto;
    padding: 12px;
}
#bpo.bpo-btm.price #price-list .flex-box .child {
    width: 100%;
    max-width: unset;
    margin-right: 0;
}
#bpo.bpo-btm.price #clear .img-box {
    width: 35%;
    margin: 0px auto 50px;
}
#bpo.bpo-btm.price #clear .box {
    width: 98%;
}
#bpo.bpo-btm.price #clear .fukidashi.pt01 {
    margin-bottom: 40px;
    width: 96%;
    margin-right: 0;
}
#bpo.bpo-btm.price #clear .fukidashi.pt02 {
    width: 90%;
    margin-left: 0;
}
#bpo.bpo-btm.price #clear p {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.4;
}
#bpo.bpo-btm.price #clear .fukidashi h4.title {
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.4;
}
#bpo.bpo-btm.price #clear .fukidashi.pt01::after {
    -webkit-transform: rotate( 344deg );
    transform: rotate( 344deg );
    right: 3%;
    top: 95%;
    bottom: -22px;
}
#bpo.bpo-btm.price #clear .fukidashi.pt02::after {
    -webkit-transform: rotate(332deg );
    transform: rotate( 332deg );
    left: 22%;
    right: 98%;
    bottom: -24px;
}
#bpo.bpo-btm.price #price-list h2 {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 18px 1em;
}
/*------------------------------
#itbu あなたのIT部 W480
------------------------------*/
#itbu .it-mv {
    background-image: unset;
    height: auto;
}
#itbu .it-mv.pc {
    display: none;
}
#itbu .it-mv.sp {
    display: block;
}
#itbu .it-mv .gra-box span.large {
    font-size: 18px;
    font-size: 1.8rem;
}
#itbu .it-mv .gra-box span.l-large {
    font-size: 18px;
    font-size: 1.8rem;
}
#itbu .it-mv .gra-box p {
    font-size: 13px;
    font-size: 1.3rem;
}
#itbu #nayami {
    margin-top: 16px;
}
#itbu #clear {
    margin-top: 24px;
}
#itbu #clear h3.title {
    font-size: 26px;
    font-size: 2.6rem;
    width: 70%;
    border-bottom: unset;
}
#itbu #clear h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#itbu #clear .img-box {
    max-width: 290px;
    width: 100%;
    margin: 40px auto 50px;
}
#itbu #clear .img-box img {
    max-width: 200px;
}
#itbu #clear .flex-box {
    display: block;
}
#itbu #clear .fukidashi.pt01 {
    width: 80%;
    margin-left: 0;
}
#itbu #clear .fukidashi.pt02 {
    width: 70%;
    margin-right: 0;
}
#itbu #clear .fukidashi.pt01::after {
    border-top-width: 18px;
    border-left-width: 1px;
    border-right-width: 16px;
    border-bottom-width: 28px;
    margin-top: 0;
    border-right-color: #F1C50F;
    right: 79%;
    top: 89%;
    z-index: 0;
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
}
#itbu #clear .fukidashi.pt02 {
    top: 21px;
}
#itbu #clear .fukidashi.pt02::after {
    border-top-width: 30px;
    border-left-width: 0px;
    border-right-width: 19px;
    border-bottom-width: 38px;
    right: -120px;
    left: 0;
    top: 63px;
    -webkit-transform: rotate(41deg);
    transform: rotate(41deg);
}
#itbu #clear h3.title span img {
    max-width: 200px;
    width: 100%;
    position: relative;
    left: auto;
    right: auto;
    padding-bottom: 4px;
    border-bottom: 7px solid#F8E182;
}
#itbu #clear .text-box p .sp {
    display: block;
}
#itbu #clear .fukidashi p {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.6;
}
#itbu #clear h3.title span.border {
    border-bottom: 7px solid#F8E182;
}
#itbu #clear .flex-box {
    display: flex;
}
#itbu #clear .fukidashi {
    width: 48%;
}
#itbu #clear .fukidashi:after {
    position: absolute;
    bottom: -29px;
    top: auto;
    left: auto;
    right: 102px;
    width: 0;
    margin: 0 auto;
    height: 0;
    content: '';
    border-width: 33px 30px 0 1px;
    border-style: solid;
}
#itbu #clear h3.title span {
    position: relative;
    padding: 0 6%;
    display: inline-block;
}
#itbu #clear h3.title span.img:before {
    content: "ちょこっとおまかせ";
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    position: relative;
    top: -4px;
    right: 8px;
}

/*#it-feature W480*/
#itbu #it-feature h2 {
    width: 70%;
    margin: 20px auto 20px;
}
#itbu #it-feature.inner {
    width: 90%;
    padding: 0 10px;
}
#itbu #it-feature .dot-box {
    padding: 0 10px;
}
#itbu #it-feature .flex-box .child {
    width: 100%;
    margin-right: 0;
}
#itbu #it-feature h2 {
    line-height: 40px;
    height: 40px;
    font-size: 18px;
    font-size: 1.8rem;
}
#itbu #it-feature h2:before, #itbu #it-feature h2:after {
    height: 38px;
    border: 20px solid #9CBD16;
}
#itbu #it-feature h2:after {
    right: -34px;
    border-right-width: 15px;
    border-right-color: transparent;
}
#itbu #it-feature h2:before {
    left: -34px;
    border-left-width: 15px;
    border-left-color: transparent;
}
/*#help-desk W480*/
#itbu #help-desk h2.title {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 0;
}
#itbu #help-desk .flex-box .child {
    width: 100%;
    margin: 0 auto 24px;
    max-width: unset;
}
#itbu #help-desk .flex-box .child:nth-of-type(3n) {
    margin-right: auto;
    margin-left: auto;
}
#itbu #help-desk .Offer-list {
    padding: 16px 10px;
}
/*#itbu chokomaka W480*/
#itbu .chokomaka {
    margin: 24px auto 48px;
}
#itbu .chokomaka h3.title {
    border-bottom: unset;
}
#itbu .chokomaka h3.title span.img:before {
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    position: relative;
    top: 0;
    right: 8px;
}
#itbu .chokomaka h3.title span {
    position: relative;
    padding: 0 6%;
    display: inline-block;
}
#itbu .chokomaka h3.title span.border {
    border-bottom: 7px solid#F8E182;
}
#itbu .chokomaka h3.title span img {
    max-width: 200px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    left: auto;
    right: auto;
    border-bottom: 7px solid#F8E182;
}
/*#it-image ご利⽤イメージ W480*/
#itbu #it-image .works-box {
    border: unset;
    margin: 40px auto 12px;
}
#itbu #it-image .works-box.it {
    border: unset;
}
#itbu #it-image .up img {
    max-width: 90px;
}
#itbu #it-image h3 {
    height: auto;
    font-size: 14px;
    font-size: 1.4rem;
}
#itbu #it-image h4 {
    padding: 4px 24px;
}
#itbu #it-image .arrow img {
    position: relative;
    right: auto;
    bottom: 0;
    width: auto;
}
#itbu #it-image .flex-box .child {
    width: 100%;
    margin-right: 0;
}
#itbu #it-image .arrow.sp {
    display: block;   
}
#itbu #it-image .arrow.pc {
    display: none;
}
#itbu #it-image h2.title {
    margin: 0 auto 8px;
    font-size: 20px;
    font-size: 2.0rem;
    max-width: 170px;
}
/*#it-case W480*/
#itbu #it-case h2 {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 18px 1em;
}
#itbu #it-case .flex-box .child {
    width: 100%;
    margin-right: 0;
}
#itbu #it-case .flex-box span.img img {
    max-width: 58px;
}

/*#menu W480*/
#itbu #menu .box {
    margin-bottom: 0;
    margin-top: auto;
    width: auto;
}
#itbu #menu .flex-box {
    display: block;
}
#itbu #menu .btn a {
    max-width: 360px;
    min-width: unset;
}
#itbu #menu .img-box img {
    margin: 0 auto;
    display: block;
}
#itbu #price-list .flex-box .child {
    width: 100%;
    max-width: unset;
    margin-right: 0;
}
#itbu #price-list .service .box p {
    line-height: 1.5;
    margin-left: 0;
}
#itbu #price-list .service ul li {
    line-height: 1.5;
}
#itbu #price-list h2 {
    font-size: 22px;
    font-size: 2.2rem;
    padding: 18px 1em;
}
#itbu #price-list .child h4 {
    font-size: 30px;
    font-size: 3.0rem;
}
#itbu #contactbox {
    height: 100%;
    width: 90%;
    margin: 48px auto 2px;
}
#itbu #contactbox .f-contactbox .telbox, #itbu #contactbox .f-contactbox .conbox {
    width: 100%;
    margin: 32px auto;
}
#itbu #contactbox .flex-wrap {
    display: block;
}
#itbu #contactbox i {
    font-size: 40px;
    font-size: 4.0rem;
    margin-left: -41px;
}
#itbu #contactbox .f-contactbox .telbox .tel {
    margin-right: -38px;
}
/*#itbu #line-box W480*/
#itbu #line-box .box {
    text-align: left;
    margin-bottom: 20px;
    padding: 5% 10px;
    width: 100%;
}

}
@media screen and (max-width:375px) {
/**************************************************
/* 共通（レイアウト・見出し・その他・パンくず・header・mailform・戻るボタン・footer）
***************************************************/
/*--------------------------------------------------
header
----------------------------------------------------*/
.logo {
    width: 70%;
}
#header h1 {
    position: absolute;
    left: 23%;
    top: 3%;
}
#u-header .inner {
    padding: 10px 0px 0px;
}
.Hd-upper {
    height: auto;
}
.Hd-upper h1 {
    left: 86px;
}
#u-header nav#Hd-lang {
    height: 34px;
}
/*--------------------------------------------------
nav
----------------------------------------------------*/
label img {
    top: 27px;
	width: 35px;
}
/**************************************************
/* 3. TOP /
***************************************************/
		.com-fl2 .com-fl2-in-01:nth-of-type(1) {
    margin-bottom: 19px;
}
/**************************************************
/* 12.お問い合わせ　//contact
***************************************************/
#mailform th {
    width: 100%;
    display: block;
	text-align: left;
}
#mailform td {
    width: 100%;
    display: block;
	height: auto;
}
#com-table .table01 th {
    width: 25%;
    width: 100%;
    display: block;
	border-right: 0px;
}
#com-table .table01 td {
    padding: 20px 0em;
    width: 100%;
    display: block;
    height: auto;
}
/**************************************************
10.採用一覧//recruit/index.html
***************************************************/
	#careers #occupation-list #tab li {
  font-size: 14px;
  font-size: 1.4rem;
}
/**************************************************
/* 16. 個人情報保護方針 /privacy/
***************************************************/
/*--------------------------------------------------
.pri-table .table03
----------------------------------------------------*/
#pp01-add {
    padding: 10px 0em 10px 3em;
}

/**************************************************
BPO
***************************************************/
#bpo #nayami .img-box img {
    width: 70%;
    max-width: 180px;
    top: 227px;
    margin: 21px 0 70px auto;
}

}

@media screen and (max-width:320px) {
/**************************************************
/* 2. 共通（レイアウト・見出し・その他・table・header・footer・ハンバーガー・btn・戻るボタン・footer
***************************************************/
/*--------------------------------------------------
header
----------------------------------------------------*/
.logo {
    width: 70%;
}
#header h1 {
    position: absolute;
    left: 23%;
    top: 3%;
}
.Hd-upper h1 {
    left: 73px;
    top: 5px;
    font-size: 11px;
}

label img {
    width: 32px;
}
/**************************************************
/* 3. TOP /
***************************************************/
.com-fl2 .com-fl2-in-01:nth-of-type(1) {
    margin-bottom: 19px;
	}
/**************************************************
/* 4. 下層共通事項（レイアウト・見出し・header・nav・パンくず）
***************************************************/
/*--------------------------------------------------
下層レイアウト ※変更不可
----------------------------------------------------*/
.pages {
    padding-top: 100px;
}
/**************************************************
/* 10. 採用一覧
***************************************************/
#careers #occupation-list #tab a{
	display: block;
	padding: 20px;
	line-height: 20px;
}
#careers #occupation-list .employment li {
  font-size: 12px;
  font-size: 1.2rem;
}
.careers-flow .number {
  margin: 0 0 0 1px;
  padding: 2px 5px;
}
.flow-txt {
  font-size: 12px;
  font-size: 1.2rem;
}
/**************************************************
/* BPO w320
***************************************************/
#bpo p {
    font-size: 14px;
    font-size: 1.4rem;
}
#bpo .bpo-mv .gra-box span.large {
    font-size: 18px;
    font-size: 1.8rem;
}
#bpo .bpo-mv .gra-box span.l-large {
    font-size: 18px;
    font-size: 1.8rem;
}
#bpo .bpo-mv .gra-box p {
    font-size: 13px;
    font-size: 1.3rem;
}
#bpo h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo .child p, #bpo .Offer {
    margin-bottom: 20vh;
}
#bpo #nayami .triangle {
    bottom: -100px;
}
#bpo #nayami .flex-box {
    margin-top: 90px;
}
#bpo #nayami .child h3 {
    font-size: 18px;
    font-size: 1.8rem;
}
#bpo #nayami h2.title span {
    background-position-y: 31px;
}
#bpo #nayami .Offer {
    margin-bottom: 13vh;
}
#bpo #clear h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo #clear h3.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#bpo #contactbox .telbox .tel img {
    max-width: 200px;
}
#bpo #contactbox p {
    font-size: 14px;
    font-size: 1.4rem;
}
/*BPO下層ページ W320*/
#bpo.bpo-btm .bpo-mv .balloon img {
    width: 90%;
    top: 15px;
}
#bpo.bpo-btm #example h2 {
    font-size: 20px;
    font-size: 2.0rem;
    padding: 1.5rem 1rem;
}
#bpo.bpo-btm #case h2 {
    max-height: unset;
    min-height: unset;
}
#bpo.bpo-btm #case h2 span {
    margin-bottom: 0;
}
#bpo.bpo-btm .Offer {
    margin-bottom: 6vh;
}
#bpo.bpo-btm.price .mv-box h3.title span.img:before {
    top: -3px;
}
#bpo.bpo-btm.price .mv-box h3.title span img {
    max-width: 165px;
}
#bpo.bpo-btm.price .mv-box h3.title {
    width: auto;
}

/*------------------------------
#itbu あなたのIT部 W320
------------------------------*/
#itbu p {
    font-size: 14px;
    font-size: 1.4rem;
}
#itbu .it-mv .gra-box span.large {
    font-size: 18px;
    font-size: 1.8rem;
}
#itbu .it-mv .gra-box span.l-large {
    font-size: 18px;
    font-size: 1.8rem;
}
#itbu .it-mv .gra-box p {
    font-size: 13px;
    font-size: 1.3rem;
}
#itbu #it-feature h2 {
    font-size: 18px;
    font-size: 1.8rem;
}
#itbu #it-feature h3 {
    font-size: 16px;
    font-size: 1.6rem;
}
#itbu #help-desk h2.title {
    font-size: 1.8rem;
    font-size: 18px;
}
#itbu #clear h3.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#itbu #clear h2.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#itbu #clear .fukidashi.pt01 {
    width: 100%;
}
#itbu #clear .fukidashi.pt01::after {
    border-top-width: 19px;
    border-left-width: 11px;
    border-right-width: 16px;
    border-bottom-width: 19px;
    margin-top: 0;
    top: 88%;
    z-index: 0;
    -webkit-transform: rotate( 16deg );
    transform: rotate( 16deg );
}
#itbu #clear .fukidashi.pt02 {
    top: 35px;
    width: 90%;
}
#itbu #clear .img-box img {
    max-width: 200px;
}
#itbu #it-case h4 {
    padding: 16px 36px 16px 22px;
    line-height: 1.4;
}
#itbu #it-case .detail {
    padding: 10px 16px;
}
#itbu .chokomaka h3.title {
    font-size: 20px;
    font-size: 2.0rem;
}
#itbu .chokomaka h3.title span img {
    max-width: 200px;
}
#itbu #price-list .service h3 {
    font-size: 20px;
    font-size: 2.0rem;
}
#itbu #price-list .service .box h4 {
    margin-left: 0;
}
#itbu #price-list .service ul {
    margin-left: 10px;
}
#itbu #price-list .service .box ol {
    margin-left: 22px;
}
#itbu #contactbox .telbox .tel img {
    max-width: 200px;
}

}