@charset 'UTF-8';
/*****************************************************

works

*****************************************************/

.title-box h1 img{width:9%;}
.title-box h2 {text-shadow:0 0 3px #fff;}


/* ▼▼▼▼▼▼▼▼MaxWidth1500(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1500px) {
 /* ************** */

.title-box h1 img{width:13%;}

 /* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */

.title-box h1 img{width:16%;}

 /* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

.title-box h1 img{width:19%;}

 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */

.title-box h1 img{width:23%}
.title-box h2 {
color:#fff;
text-shadow:0 0 3px #000;
}
 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */
	
.title-box h1 img{width:26%;}

 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */

.title-box h1 img{width:29%;}

 /* *************** */
}

/*****************************************************

block01 リンクボタン

*****************************************************/

#block01{
margin:4% auto;
width:100%;
max-width:800px;
display:flex;
flex-flow: row wrap;
}

#block01 p{
margin:0 auto;
width:50%;
text-align: center;
}


/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth1024(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */


 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */


#block01{
margin:1% auto;
padding:0 2%;
}
#block01 p{
padding:2%;
}
 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */

#block01{
padding:1% 5%;
}
#block01 p{
width:100%
}

 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}


/*****************************************************

コンテンツ部分（in out共通）

*****************************************************/

#in,#out{
margin:4% auto;
width:100%;
}

hr{
margin:2% auto;
width:100%;
max-width:1200px;
border:1px solid #fb7289;
}

/* 受注代行タイトル */
.title01{
margin:5% auto 0;
width:100%;
}

/* 電話代行タイトル */
.title02{
margin:8% auto 0;
width:100%;
}


/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */

 /* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth1024(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */

#in,#out{
margin:8% auto;
}

/* 受注代行タイトル */
.title01{
margin:10% auto 0;
}

 /* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

/* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */

/* 受注代行タイトル */
.title01{
margin:10% auto 0;
width:40%;
}

/* 電話代行タイトル */
.title02{
margin:8% auto 0;
width:50%;
}

 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */


/* 受注代行タイトル */
.title01{width:45%;}

/* 電話代行タイトル */
.title02{
margin:15% auto 0;
width:55%;}

/* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}



/*****************************************************
article01
*****************************************************/

#article01{
margin:3% auto;
width:100%;
max-width:800px;
}

.h3-01{
margin:5% auto 0;
width:100%;
font-size:20px;
font-weight:600;
color:#fb7289;
border-bottom:1px solid #fb7289;
text-align: left;
padding:0.5% 2%;
letter-spacing: 0.07em;
}

#article01 p{
margin:1% auto;
width:100%;
font-size:15px;
font-weight:500;
color:#353535;
text-align: justify;
padding:0.5% 2%;
line-height:1.6;
letter-spacing: 0.07em;
}



/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth1024(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */

#article01{
padding:1% 5%
}

 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

.h3-01{
font-size:18px;
}

#article01 p{
font-size:13px;
}


 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */



 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */


#article01{width:90%;}
#article01 p{padding:2%;}

 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}




/*****************************************************
article02　お客様のニーズ
*****************************************************/

#article02{
margin:6% auto;
width:100%;
}

.needs-title{
margin:0;
text-align: left;
padding:0 6%;
}

#article02 div{
margin:0;
width:1100px;
text-align: left;
position:relative;
background:#ffe6e3;
padding:3% 7%;
}

#article02 ul{
margin:0 auto 4%;
width:100%;
display:flex;
flex-flow:row wrap;
}

#article02 ul li{
margin:2% auto;
width:50%;
text-align: center
}
#article02 hr{
margin:-2% 0 0;
width:100%;
border:2px solid #fffbfc;
z-index:10;
position: relative
}

/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */

#article02 div{
width:1000px;
}

 /* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth1024(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */

#article02 div{
width:90%;
}

.needs-title{
width:60%;
}
#article02 ul{padding:1% 0;
}
#article02 ul li{
padding:1% 4%;
}

 /* *************** */
}

/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

#article02 div{
width:100%;
}

.needs-title{
margin:10% auto 0;
text-align: center;
width:90%;
padding:0 6%;
}

#article02 ul{padding:4% 0;}

#article02 ul li{
margin:4% auto;
width:70%;
}

#article02 hr{
margin:-5% 0 0;
width:100%;
border:2px solid #fffbfc;
z-index:10;
position: relative;
}
 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */

.needs-title{
width:90%;
padding:0;
}


#article02 ul li{
margin:4% auto;
width:90%;
}


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}



/*****************************************************
article03　選ばれる理由
*****************************************************/

#article03{
margin:8% auto;
width:100%;
max-width: 1200px;
}

.choose-title{
margin:5% auto;
width:100%;
}

#article03 ul{
margin:1% auto;
width:100%;
display: flex;
flex-flow: row wrap;
}

#article03 ul li{
margin:1% auto;
width:25%;
padding:0 1%;
}

#article03 ul li dl{
margin:0 auto;
width:100%;
}

#article03 ul li dl dt{
margin:0 auto;
width:100%;
}

/*小見出しdd*/
#article03 ul li dl dd:nth-of-type(1){
margin:4% auto 2%;
width:100%;
color:#fb7289;
font-size:22px;
line-height:1.8;
letter-spacing: 0.05em;
}

/*小見出しdd*/
#article03 ul li dl dd:nth-of-type(2){
margin:0 auto;
width:100%;
color:#353535;
font-size:15px;
line-height:1.6;
letter-spacing: 0.05em;
text-align: justify
}


/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */

#article03{padding:0 5%;
}

 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth1024(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */

#article03 ul li{
margin:3% auto;
width:50%;
padding:0 2%;
}

/*小見出しdd*/
#article03 ul li dl dd:nth-of-type(2){
width:90%;
}
 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */


.choose-title{
margin:10% auto;
text-align: center
}
.choose-title img{
margin:0 auto;
}
#article03{
margin:20% auto;
}

 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */

.choose-title{padding:0 10%;
}

#article03 ul li{
margin:5% auto;
width:80%;
padding:0 2%;
}
 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}



/*****************************************************
article04　導入事例
*****************************************************/

#article04{
margin:8% auto;
width:100%;
background:#ffe6e3;
padding:4%;
}

.table-title{
margin:2% auto;
width:100%;
max-width: 970px;
text-align: left
}

#article04 p{
margin:2% auto;
width:100%;
max-width: 1000px;
text-align: center
}


/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

.table-title{
padding:4% 10% 0;
background:#fff5f4;
margin:0 auto;
}

#article04{
padding:0;
background:none;
}

#article04 dl:nth-of-type(odd){
margin:0 auto;
width:100%;
background:#fff5f4;
padding:6% 0;
position:relative
}

#article04 dl:nth-of-type(even){
margin:0 auto;
width:100%;
background:#fddcde;
padding:6% 0;
position:relative
}

#article04 dl:first-of-type{
padding:3% 0;
}

#article04 .table01 div{
margin:0 auto;
width:49%;
display:inline-block;
vertical-align: top
}

#article04 dl dt{
margin:2% auto 0;
width:60%;
background:#fb7289;
color:#fff;
padding:1% 2%;
letter-spacing: 0.05em;
line-height:1.8;
}

#article04 dl dd{
margin:1% auto;
width:60%;
color:#fb7289;
padding:1% 2%;
letter-spacing: 0.05em;
line-height:1.6;
text-align: left;
}

 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */

.table-title{
padding:8% 10% 0;
text-align: center
}

#article04 dl dt{
width:80%;
font-size:14px;
}

#article04 dl dd{
margin:1% auto;
width:80%;
font-size:14px;
}
 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */


.table-title img{
width:35%;
}
 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}



/*****************************************************
article05　イメージ図
*****************************************************/

#article05{
margin:8% auto;
width:100%;
padding:8%;
text-align: center;
}


/* ▼▼▼▼▼▼▼▼MaxWidth1200(pc)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1200px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth1024(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */


 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth768(tablet)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */


 /* *************** */
}


/* ▼▼▼▼▼▼▼▼MaxWidth600(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */

#article05{
margin:15% auto;
padding:4%;
}

 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth480(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */


 /* *************** */
}
/* ▼▼▼▼▼▼▼▼MaxWidth380(mobile)▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */


 /* *************** */
}