@charset "utf-8";

body{font-size: 16px;}

.respo-mt1{margin-top: 80px;}
.respo-mt2{margin-top: 50px;}
.respo-mt3{margin-top: 30px;}
.respo-mt10{margin-top: 10px;}
.respo-mt5{margin-top: 5px;}
.h2after{margin-top: 50px;}

#head-sp,#spmenu,.sp-only,.tb-only,.sp-tb-only,#sp-tb-navi{display: none;}
.br-blook-pc{ display:block}
.img100{width: 100%;}
.img150{max-width: 150px;}
.img50{width: 50%!important;margin: 0 auto;}

/*page　ID*/
#top-page{}
#voice-page{}



/*------------------------ベースレイアウト------------------------*/
.wrap1200{
  max-width:1250px;
  width: 100%;
  padding-right:25px;
  padding-left:25px;
  margin-right:auto;
  margin-left:auto;
}
.wrap1000{
  max-width:1050px;
  width: 100%;
  padding-right:25px;
  padding-left:25px;
  margin-right:auto;
  margin-left:auto;
}
.mainimg-wrap1200{
  max-width:1250px;
  width: 100%;
  padding-right:25px;
  padding-left:25px;
  margin-right:auto;
  margin-left:auto;
}

/*------セクション------*/
.section-1,.section-common{padding: 100px 0px;}
.section-common2{padding: 100px 0px 60px 0px;background-color:rgba(201,188,156,0.2); }
.section-common3{padding: 100px 0px 60px 0px;}
.section-common4{padding: 100px 0px 100px 0px;}
.section-common5{padding: 100px 0px 70px 0px; background-color:rgba(43,100,186,0.8);background-image: url("../img/voicebg.png");background-repeat: no-repeat;background-position: center top;}

.section-nakah1{padding: 40px 0px 40px 0px; background-color:rgba(43,100,186,0.8);background-image: url("../img/voicebg.png");background-repeat: no-repeat;background-position: center bottom;}

.section-voicesyousai{padding: 0px 0px 100px 0px;}

.read{font-weight: bold;font-size: 1.2em; text-align: center;}
span.marker {
    background: linear-gradient(transparent 50%, rgba(0,159,232,0.2) 50%);
}

/*------------------------h1------------------------*/
#top-page h1{font-size: 1.6em;color: #333;text-align: center;font-weight: 700;}
#naka-page h1{font-size: 1.6em;color: #FFF;text-align: left;font-weight: 700;}
h2{font-size: 1.6em;color: #333;text-align: center;font-weight: bold;}
.section-common2 h2,.section-common3 h2,.section-common4 h2{font-size: 1.6em;color: #2B64BA;text-align: center;}
.flex-voice1 h2{font-size: 1.6em;color: #fff;text-align: left;}

footer h2{font-size: 1.6em;color: #fff;text-align: center;}

.section-voicesyousai h2{  display: flex;
    align-items: center;font-size: 1.4em;color:rgba(43,100,186,1);}

.section-voicesyousai h2:after,.section-voicesyousai h2:before {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: rgba(43,100,186,1);
}
.section-voicesyousai h2:before {
    margin-right: 1rem;
}
.section-voicesyousai h2:after {
    margin-left: 1rem;
}
h3{font-weight: 700;}

.s-1bg h3{color: #009FE8;font-size: 1.2em;}
.flex-c-features h3{background-color:#F39800;  color: #fff;font-size: 1.2em;text-align: center;padding: 8px 10px 10px 10px;}
.flex-c-example h3{ color:#2B64BA;font-size: 1.2em;text-align: center;padding: 20px 0px 10px 0px;}
.section-common4 h3{ display: inline-block;background-color:#2B64BA;  color: #fff;font-size: 1.2em;text-align: center;padding: 5px 20px 8px 20px;}

/*------------------------ボタン------------------------*/
.btn-box2{text-align: center;margin-top: 30px;}
.btn-box3{text-align: center;margin-top: 5px;}
.gocontactbtn,.gocontactbtn:visited{max-width: 400px; /* ボタン幅 */}
.common-btn01,.common-btn01:visited{max-width: 400px; /* ボタン幅 */}
/*------------------------セクション1　T-Switchとは------------------------*/
.section-1 img{width: 100%;}

/*------------------------セクション2　特長------------------------*/
.flex-features{display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: row;
  align-items:stretch;}

.flex-c-features{width: 30%;background-color: #FFF;padding: 10px;margin: 0px 20px 40px 20px;}
.flex-c-features .text{padding: 10px; line-height: 180%; color:#2B64BA;font-weight: 500; }

/*------------------------セクション3　ご利用例------------------------*/
.flex-example{display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: row;
  align-items:stretch;}

.flex-c-example{width: 30%;margin: 0px 0px 40px 0px; text-align: center;}
.flex-c-example p{padding: 0px; line-height: 180%;text-align: center;}
.flex-c-example img{width: 100%; max-width: 250px; }

/*------------------------セクション4　料金------------------------*/
.flex-plan,.flex-fee{display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:stretch;}
.flex-plan-c1{background-color:#009FE8;color: #FFF; width: 35%;padding:10px 20px 13px 20px; text-align: center;font-weight: 500; }
.flex-plan-c2{background-color:#f2f2f2;width: 65%;padding:10px 20px 13px 20px; }

.flex-plan-c1{display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:center;}

.flex-fee-c{background-color:#E3E3E3;width: 32%;padding:10px 20px 13px 20px;text-align: center;  font-weight: 500;}

/*------------------------セクション5　導入事例------------------------*/
.flex-voice1{display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:stretch;}
.flex-voice1-c1{ width: 25%;}
.flex-voice1-c2{color:#fff;width: 75%;}

.flex-voice-box{display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: row;
  align-items:stretch;}
.flex-voice-box-c{ width: 30%;text-align: center;}
.flex-voice-box-c p{padding: 0px 0px 30px 0px; font-size: 0.9em;}
.flex-voice-box-c img{width: 100%;}


  
  
/*------------------------導入事例------------------------*/
.flex-voicepage{display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:stretch;}
.flex-voicepage-c1{ width: 55%;}
.flex-voicepage-c2{width: 40%;}
.flex-voicepage-c1 img{ width: 100%;}

.flex-voicelist{display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: row;
  align-items:stretch;
  border-bottom: solid 1px #ccc;
  }
.flex-voicelist-c1{ width: 25%; border-top: solid 1px #ccc;padding: 10px 10px 13px 10px;}
.flex-voicelist-c2{ width: 75%; border-top: solid 1px #ccc;padding:10px 10px 13px 10px;}
.flex-voicelist-c3{ width: 100%; border-top: solid 1px #ccc;padding: 10px 10px 13px 10px;}

.voicesyousai-img img{ width: 100%;}
.voicesyousai-img600 img{ width: 100%;}
.voicesyousai-img600{max-width: 600px;margin-left: auto;margin-right: auto;}
.voicesyousai-img800 img{ width: 100%;}
.voicesyousai-img800{max-width: 800px;margin-left: auto;margin-right: auto;}

.flex-voicesyousai-img{display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:stretch;}
.flex-voicesyousai-c3{width: 33%;}
.flex-voicesyousai-c2{width: 47%;}
.flex-voicesyousai-c1{width: 100%;}
.flex-voicesyousai-img img{width: 100%;}

/*------------------------セクション6 機器仕様------------------------*/
.flex-siyou{display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:stretch;}
.flex-siyou-c{ width: 49%; font-size: 0.9em;}
.flex-siyou-c2{ width: 49%; font-size: 0.9em;}

/*------------------------お問い合わせ------------------------*/
.flex-contact{display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: row;
  align-items:stretch;
 border-bottom: 1px solid #ccc;}
.contents1{width: 25%; border-top: 1px solid #ccc;padding: 15px 10px 10px 10px;}
.contents2{width: 75%; border-top: 1px solid #ccc;padding: 10px;}

/*------------------------ヘッダー------------------------*/
header{
  z-index: 1000;
  position: sticky;
  top: 0;
}
#pc-head {height: 100px; position: relative;background: #FFF;}
#pc-head .flex-head-logo{
  height:80px;
  background-image: url("../img/logo_b.png");
}
#pc-head.onScroll .flex-head-logo{
  background-image: url("../img/logo_w.png");
}
#pc-head .flex-head-logo:hover{
  opacity: 0.5;
}
#pc-head.onScroll {
  height: 100px; background-color:#009FE8!important;position: relative;background:none;
}
#flex-head{display: flex;
  width: 100%; 
  justify-content: space-between;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:center;
  padding:20px 0px;}
  
.flex-head-logo{width:250px; }
.flex-head-logo img{width:100%; max-width: 250px; }
.flex-head-navi{width: calc(100% - 250px);padding-left: 150px;}

.flex-navi-box{width:100%;background-color: 333;
display: flex;
 justify-content: flex-start;
  flex-wrap: nowrap;
  flex-direction: row;
  align-items:center;}
.flex-navi-box-c1{width: 14%;
  font-size: 1.1em;}
.flex-navi-box-c2{width: 18%;
  font-size: 1.1em;}
@media (max-width: 1200px) { .flex-navi-box{
font-size: 1.3vw;
}
.flex-head-navi{width: calc(100% - 250px);padding-left: 0px;}
}
@media (max-width: 1000px) { .flex-navi-box{
font-size: 1.3vw;
}
.flex-head-navi{width: calc(100% - 250px);padding-left: 0px;}
.flex-head-logo{width:250px; }
}

.main-navi,.main-navi:visited{
display: inline-block;
  width: 100%;
  height: 100%;
  color: #333; /* 文字色 */
 padding: 8px 0px 10px 0px;
  text-decoration: none;
  text-align: center;
  transition: 0.5s;
  border-radius: 0px;

}
#pc-head.onScroll .main-navi
{
  color: #fff; /* 文字色 */
}

/* マウスオーバーした際のデザイン */
.main-navi:hover {
  color: #FFF !important; /* 文字色 */
  background: #00A0E9; /* 背景色 */
  text-decoration: none;
}
#pc-head.onScroll .main-navi:hover {
  color: #fff !important; /* 文字色 */
  background: rgba(255,255,255,0.2); /* 背景色 */
  text-decoration: none;
}

/*------------------------メインイメージ------------------------*/
#topmainbg{ height: 600px; background-image: url("../img/topimgbg.png");background-position: center;}
#topmainimg img{width: 100%;}
#topmainimg-sp{display: none;}


/*------------------------footer------------------------*/
#footer{padding: 100px 0px 60px 0px; background-color:#009FE8;color: #FFF;}

/*コンタクト*/
.contact-wrap{text-align: center;}
.teldial{font-size: 40px;margin-top: 20px;font-weight: 700;}
.teldial a,.teldial a:visited{color: #FFF;text-decoration: none;}
.teldial a:hover{color: #FFF;text-decoration: underline;}
.telwelname{font-weight: 500;font-size: 1.2em;line-height: 160%;}
/*------copy　審査------*/
.flex-copy{display: flex;
  width: 100%; 
  justify-content: space-between;
  flex-wrap: wrap;
  flex-direction: row;
  align-items:stretch;
  margin-top: 60px;}
.flex-copy-c1{width: 80%;font-size: 0.8em;}
.flex-copy-c2{width: 20%;text-align: right;font-size: 0.8em;}
.sinsa{border: 1px solid #ccc;padding: 2px 5px 5px 5px;}

/*------gotop------*/
.gotop{
	height: 40px;
	width: 40px;
	position: fixed;
	right: 0px;
	bottom: 0px;
	margin-right: 10px;
	margin-bottom: 10px;
}
.gotop img{	width: 100%;}


a.anchor{
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}