/*
Theme Name: shohanyo
Author: sho yoshimaru
Description: This is my original theme.
Version: 1.0
*/
@charset "utf-8";

@import url(https://fonts.googleapis.com/css?family=Julius+Sans+One);
@font-face {font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: bold; src: url('font/noto_bold.ttf');}
@font-face {font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: normal; src: url('font/noto_normal.ttf');}
@font-face {font-family: 'Noto Sans Japanese'; font-style: normal; font-weight: 500; src: url('font/noto_media.ttf');}
@font-face {font-family: 'Montserrat'; font-style: normal; font-weight: bold; src: url('font/Montserrat_bold.ttf');}
@font-face {font-family: 'rounded-mgenplus'; font-style: normal; font-weight: 700;src: url('font/round-bold.ttf');}
@font-face {font-family: 'rounded-mgenplus'; font-style: normal; font-weight: 600;src: url('font/round-medium.ttf');}
@font-face {font-family: 'rounded-mgenplus'; font-style: normal; font-weight: 400;src: url('font/round-regular.ttf');}


/*-------------------------------------------
ベースコーディング
-------------------------------------------*/
/*文字コード*/
body, textarea, input, select{font-family: "Noto Sans Japanese", "ＭＳ Ｐゴシック", sans-serif; font-size: 16px; color: #333; letter-spacing: 1px; line-height: 1.5; word-break: break-all;}
h1,h2, h3, h4, h5{color: #333; letter-spacing: 1px; line-height: 1.5;}
article, aside, figure, figcaption, details, footer, header, hgroup, nav, section, summary{display: block;}
/*list*/
ul,li,dl{padding: 0; margin: 0; list-style: none;}
strong{font-weight: bold;}
.table td, .table th{vertical-align: middle;}
.aligncenter{margin: 0 auto; display: block;}

/*-------------------------------------------
ヘッダー
header{position: relative; margin: 0 0 20px;}
#headBar{overflow: hidden;}
.pageName{font-family: 'Montserrat','rounded-mgenplus'; font-weight: bold; float: left; padding: 15px; font-size: 20px;}
.navBtn{color: white; cursor: pointer; background: black; padding: 15px; float: right; font-size: 20px;}
nav{padding: 0 0 35px; display: none;}
nav li a{display: block; padding: 10px 10px; border-bottom: solid 1px #f8f8f8;}
-------------------------------------------*/
header{position: relative; margin: 0 0 20px; padding: 25px 0;}
#headBar{overflow: hidden; display: flex; align-items: center;}
#headBar p{margin: 0;}
.productNameDes{font-size: 11px; order: 2;}
.productName{font-size: 30px; font-weight: bold; order: 1; padding: 0 10px 0 0;}
#headBar .navBtn{cursor: pointer; order: 3; margin-left: auto;}
nav{padding: 10px 0 35px; display: none;}
nav li a{display: block; padding: 10px 10px;}



/*-------------------------------------------
メインビジュアル
-------------------------------------------*/
/* メインビジュアル背景 */
#mainVisual{position: relative; padding: 0px 0 60px;}
#mainVisual::before{
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: '';
}
#mainVisual img[src$=".jpg"],#mainVisual img[src$=".jpeg"],.mvImage img[src$=".jpg"],.mvImage img[src$=".jpeg"]{border-radius: 25px;}
.mvimgunderh1{margin: 0 0 20px;}
.mainImgInsert{margin: 0;}

.mainOverlay{position: relative;}
/* レイアウト */
.singleMain{max-width: 768px; margin: 0 auto;}
.mainCenterSet{text-align: center;}
/* バッチ */
.popularBadge{overflow: hidden;}
.popularBadge li i{font-size: 22px; display: inline-block; margin: 0px 0 2px;}
.popularBadge li{
  font-size: 12px;
  text-align: center;
  min-height: 100px;
  line-height: 1.2;
  padding: 0 35px;
  background:
    url(img/m_e_point_left.png) no-repeat top left,
    url(img/m_e_point_right.png) no-repeat top right;
  float: left;
  margin: 10px 20px 30px 0;
}
/* h1 */
h1.sentenceH1{font-size: 20px; text-shadow: 2px 2px 6px #2e2e2e; margin: 0px 0 30px; font-weight: lighter;}
h1.sentenceH1 span.strongIssue{font-weight: bold;}
h1.sentenceH1 span.mainIssue{font-size: 26px; display: block; margin: 15px 0;}
h1.pointH1{font-size: 22px; margin: 0px 0 30px;}
h1 .pointStrong{background: black; color: white; padding: 0 10px; display: inline-block; margin: 5px 0 0;}
h1 .pointStrong strong{font-size: 30px;}
.mvCenterImg{text-align: center;}
/* MVパーツ */
.mainProductName{font-size: 30px; font-weight: bold; margin: 0px 0 0; font-family: 'Montserrat';}
.mainPrice{margin: 0; font-size:22px; text-shadow: 1px 1px 3px #2e2e2e;}
.mainPrice span.strongPrice,.mainPrice strong{font-weight: bold; font-size: 50px; margin: 0 5px;}
.mainToform{display: inline-block; padding: 15px 20%; border-radius: 30px; color: white; font-weight: bold;}
/* MV補足 */
.mainHosoku{font-size:8px; margin:30px 0 0px; position: relative;}
#mainVisual textarea{height: 100px;}

.onlyPngTac{text-align: center;}

/*-------------------------------------------
メインビジュアル（スター）
-------------------------------------------*/
.popularStar{padding: 75px 0 0;}
.popularStar h1.psH1{font-size: 40px; font-weight: bold;}
/*.popularStar h1 .psH1br{display: inline-block; padding: 2px 10px; margin: 5px 0;}*/
.popularStar h1 .psH1br{display: block;}


/* バッチ */
.popularStarBadge{overflow: hidden; color: white; margin: 0 0 30px;}
.popularStarBadge li{float: left; padding: 15px 15px 12px 45px; border-radius: 10px; margin: 0 10px 0 0; font-size: 12px; background: url(img/img_badge01.png) no-repeat center left 10px #ff3030;}
.popularStarBadge li span.badgeStrong{font-weight: bold; font-size: 22px; display: block;}
/* 料金とボタン */
.psPrice{margin: 0; font-size:34px;}
.psPrice span.mvtechStrong{font-weight: bold; font-size: 90px; margin: 0 5px;}
.psPrice strong{font-weight: bold; font-size: 90px; margin: 0 5px;}
.psToform{display: inline-block; padding: 20px 20%; border-radius: 30px; color: white; font-weight: bold;}
.mvContactHosoku{font-size: 12px; max-height: 60px; overflow: auto; background-color: #fafafa; padding: 3px;}

/*-------------------------------------------
シナリオ
-------------------------------------------*/
.scenario{padding: 100px 10px; position: relative;}
.scenarioIcon{text-align: center; font-size: 25px; margin: 0;}
.scenarioStep{margin: 0px 0 10px; text-align: center;}
.scenario h2{text-align: center; font-size: 22px; margin: 0 0 20px; font-weight: lighter;}
.scenarioSuggestion .scenarioIcon,.scenarioSuggestion .scenarioStep{color: #333;}
.scenario.textwhite,.scenario.textwhite h2,.scenario.textwhite h3,.scenario.textwhite p,#scenario .scenario.textwhite li i{color: white;}
.scenario.textwhite h3{background: linear-gradient(transparent 87%, #ffff66 87%); display: inline-block;}
.scenarioValue{position: relative;}
.scenarioValue::before{
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: '';
  background-color: rgba(0, 0, 0, 0.85);
}
.scenarioProblem h3{font-size: 21px; text-align: center; margin: 60px 0 20px;}
.scenarioValue h2{color: white;}
.logics{padding: 100px 0;}
#lolics .logics:first-child{padding-top: 0px;}
#lolics .logics:nth-child(even){background: #f8f8f8;}

.scenarioSuggestion table td{background-color: white;}

.logicsStep{margin: 0 auto 5px; padding: 3px 20px; width: 200px; text-align: center; background: black; color: white;}
.logics h3{font-size: 21px; text-align: center; margin: 0 0 20px;}
.logics h4{font-size: 19px;}
.logicDetails{margin: 50px 0 20px;}
#scenario ul{margin: 20px 0; padding: 0 0 0 25px;}
#scenario li{margin: 0 0 10px; position: relative;}
#scenario li i{font-size: 17px; display: inline-block; position: absolute; left: -25px; top: 2px;}
#scenario blockquote{padding: 20px; border-radius: 20px; margin: 20px 0; font-style: italic; background: #cccccc;}
#scenario blockquote p{margin: 10px 0;}
/*動画*/  
#scenario iframe,#feature iframe,.mainMovieInsert iframe,.mainMovieH1Insert iframe{width: 500px; height: 278px; max-width: 100%; max-height: 100%; margin: 0 auto;}
.mainMovieH1Insert{margin: 30px 0 20px 0;}
/*cta手紙*/
.ctaToForm{text-align: center;}
.ctaToForm a{background: black; color: white; width: 100%; max-width: 370px; padding: 15px; display: inline-block; font-weight: bold; border-radius: 10px;}
.frameCtaLetter{margin: 100px 0 100px; background: #f0f0eb; padding: 50px 10px;}
.ctaLetter{
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
  text-orientation: upright;
  margin: 0 auto 20px;
  height: 480px;
  font-family: sans-serif;
  line-height: 2;
  font-size: 18px;
}
.ctaLetter a{
  text-decoration: none;
  border-right: 1px dashed;
  padding-right: 3px;
}
.ctaLetter p.danraku{
  text-indent: 1em;
}
.ctaLetter .bold{font-weight: bold; margin: 0 0 3px 0;}
.ctaLetter .text-combine {
  -webkit-text-combine: horizontal;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}
/*cta通常*/
.frameCtaNormal{margin: 100px 0 100px; padding: 50px 10px;}
.ctaNormal{max-width: 370px; margin:  0 auto;}
.ctaNormal a{
  text-decoration: none;
  border-bottom: 1px dashed;
  padding-bottom: 3px;
}
.ctaNormal .bold{font-weight: bold; margin: 0 3px 0 0;}
.ctaNormal i{display: block; text-align: center; font-size: 25px; margin: 0 0 5px;}
.ctaNormal .ctaTit{text-align: center; font-size: 22px; font-weight: bold;}
.nocode_frameCtaNormal{padding: 100px 10px 120px; margin: 0;}
.nocode_ctaTit{font-size: 36px; font-weight: bold; text-align: center; margin: 0 0 65px;}
.nocode_frameCtaNormal .ctaToForm{margin: 40px 0 0;}
.frameCtaNormal.textwhite,.frameCtaNormal.textwhite h2,.frameCtaNormal.textwhite h3,.frameCtaNormal.textwhite p{color: white;}



/*-------------------------------------------
共通（commonLayoutA）
-------------------------------------------*/
.commonLayoutA{padding: 100px 0;}
.backfafafa{background: #fafafa;}
.commonLayoutA h2.claH2En{
  font-size: 40px;
  margin-bottom: 40px;
  font-weight: bold;
  font-family: 'Montserrat';
  letter-spacing: 2px;
}
.commonLayoutA h2.claH2En span.claH2Ja{
  font-size: 22px;
  color: #333;
  margin-left: 20px;
  border-bottom: solid 1px black;
  display: inline-block;
  vertical-align: middle;
}

.commonLayoutA h2.nocodeH2En{
  font-family: 'Montserrat';
  text-align: center;
  font-size:60px;
  margin: 80px 0 180px;
}
.commonLayoutA h2.nocodeH2En span.nocodeH2Ja{
  display: block;
  color: #333;
  font-size: 20px;
  font-weight: bold;
}

/*-------------------------------------------
特徴
-------------------------------------------*/
.featureDetails{margin: 50px 0 100px;}
.featureDetails:first-child{margin-top: 0px;}
.featureDetails:last-child{margin-bottom: 0px;}
.featureImg{text-align: center;}
.featureNum{font-weight: bold; display: inline-block; font-family: 'Montserrat'; margin: 0 0 20px;}
.featureDetails h3{font-size: 21px; margin: 0 0 20px; font-weight: bold;}
.scenarioProblem.featureDetails h3{text-align: left;}


.fnwrap{align-items: center; display: flex; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; margin: 100px 0 40px;}
.featureNumNocode{align-items: center; font-family: 'Montserrat'; font-size: 16px; margin: 0px 20px 0 0; padding: 4px 10px; text-align: center; min-width: 100px;}
h3.featureNumH3{align-items: center; font-size: 24px; margin: 0 0 0;}
@media (max-width: 767px){/*767px以下の時 */
.fnwrap{display: block;}
.featureNumNocode{display: inline-block; margin: 0 0 15px;}
}

/*お客様の声 1カラム*/
.nocode_voice_boxTitle{margin: 0 0 30px; align-items: center; display: flex; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex;}
.nocode_voiceThumbnail img{border-radius: 120px;}
.nocode_voiceClients{margin: 0; padding: 0;}
.col-sm-4 .nocode_voiceThumbnail img{width: 78px;}
.featureDetails{margin: 0;}
.featureDetails h4,.successStory h4{font-size: 20px; font-weight: bold; margin: 30px 0 10px;}
.featureDetails ul,.successStory ul{margin: 20px 0; padding: 0 0 0 25px;}
.featureDetails li,.successStory li{margin: 0 0 10px; position: relative;}
.featureDetails li i,.successStory li i{font-size: 17px; display: inline-block; position: absolute; left: -25px; top: 2px;}
/*テーブル*/
.tpatternA1 th{width: 30%; background: #f7f7f7;}
.tpatternA2 th{width: 30%; color: white;}
.tpatternA3 th{width: 30%;}
.tpatternB1,.tpatternB2{table-layout: fixed;}
.tpatternB1 th{text-align: center; font-size: 14px; background: #f7f7f7;}
.tpatternB1 td,.tpatternB2 td{text-align: center; font-size: 14px;}
.tpatternB1 td .tpbMidashi,.tpatternB2 td .tpbMidashi{display: block; margin: 0 0 10px; text-align: center; font-weight: bold; font-size: 12px;}
.tpatternB2 th{text-align: center; font-size: 14px; color: white;}
/*テーブル*/
.tpatternC1,.tpatternC2,.tpatternC3{table-layout: fixed; text-align: center; font-size: 14px;}
.tpatternC1 th{background: #f7f7f7;}
.tpatternC2 th{color: white;}
.scrollTable{overflow: auto;}
.pcScrollTable th{width: 120px;}
.articleFeatured{background: white; color: #666; padding: 10px; margin: 20px 0;}
/*-------------------------------------------
料金
-------------------------------------------*/
#price{background: #fafafa}
.thLeftTop,th.tltNone{border: none;}
#price td{background: white;}
#price th.tltNone{background: #fafafa;}
/*料金th最初の項目*/
.priceTablePatternA,.priceTablePatternB,.priceTablePatternC{table-layout: fixed; text-align: center; font-size: 14px;}
.priceTablePatternA th{background: #f7f7f7;}
.priceTablePatternC th{background: white;}
/*tablePriceGrade*/
.firstRow .planEn,.firstRow .planJa,.firstRow .priceAmount,.firstRow a.priceBtn{display: block; margin: 20px 0;}
.firstRow .planEn{font-weight: bold; font-family: 'Montserrat'; font-size: 16px;}
.firstRow .planJa{font-size: 22px;}
.firstRow .priceAmount{font-size: 16px;}
.firstRow .priceStrong{font-size: 32px;}
.firstRow a.priceBtn{background: black; color: white; padding: 20px 10px; font-size: 18px; border-radius: 5px;}
.tSpMidashi{display: none;}
.d-view-table{display: none;}
.priceHosoku{font-size: 12px;}
/*-------------------------------------------
競合
-------------------------------------------*/
#comparison{background: #fafafa}
#comparison td{background: white;}
#comparison th.tltNone{background: #fafafa;}
/*-------------------------------------------
メディア掲載実績
-------------------------------------------*/
#media ul{overflow: hidden;}
#media ul li{float: left; width: 20%; height: 60px; padding: 0 10px; margin-bottom: 40px;}
#media ul li img{margin: 0 auto;}

/*-------------------------------------------
実績
-------------------------------------------*/
#performance .container{position: relative;padding-top: 60px;}
#performance h2{text-align: center;color: white; position: relative; font-size: 36px;}
#performance .perfo_content{color: white; position: relative;}
#performance .perfo_content table{width: 100%; position: relative;}
#performance .perfo_content td{padding:40px 30px; margin:0 auto; text-align: center; border: solid 1px #696361; width: 33%;}
#performance p{font-size: 18px;}
#performance .perfo_text1{margin-bottom: 30px;}
#performance .perfo_text2 p{font-weight: bold; margin-bottom: 20px;}
#performance .perfo_icon{font-size: 70px;}
#performance .perfo_text2 strong{font-weight: bold;font-size: 28px; padding: 0 2px;}
#performance .container::before{background-color: rgba(0,0,0,0.7); position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ' '; width: 100%;}

.senarioPerform{position: relative;}
.senarioPerform .perfo_content{color: white; position: relative;}
.senarioPerform .perfo_content table{width: 100%; position: relative; margin: 0 0 20px;}
.senarioPerform .perfo_content td{padding:40px 30px; margin:0 auto; text-align: center; border: solid 1px #696361; width: 33%;}
.senarioPerform p{font-size: 18px;}
.senarioPerform .perfo_text1{margin-bottom: 30px;}
.senarioPerform .perfo_text2 p{font-weight: bold; margin-bottom: 20px;}
.senarioPerform .perfo_icon{font-size: 70px;}
.senarioPerform .perfo_text2 strong{font-weight: bold;font-size: 28px; padding: 0 2px;}
.senarioPerform::before{background-color: rgba(0,0,0,0.7); position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ' '; width: 100%;}
.senarioJirei{text-align: center;}
.senarioJirei h3,.marker-yellow{background: linear-gradient(transparent 70%, #ffff66 70%); font-size: 24px; display: inline-block; margin: 60px auto 20px;}
.marker-yellow-parent{text-align: center;}
.marker-yellow-nocode{background: linear-gradient(transparent 70%, #ffff66 70%);}
.marker-yellow-nocode-strong{background: linear-gradient(transparent 80%, #ffff66 80%); font-size: 24px; display: inline-block; margin: 60px auto 20px;}
.parentyellow{text-align: center;}

.parentfukidashi {
  text-align: center;
  position: relative;
  padding: 22px 10px;
  min-width: 120px;
  max-width: 100%;
  font-size: 24px;
  background: #FFF;
  border: solid 2px #333;
  border-radius: 10px;
  box-sizing: border-box;
  margin: 40px 0;
}

.parentfukidashi:before {
  content: "";
  position: absolute;
  bottom: -23px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.parentfukidashi:after {
  content: "";
  position: absolute;
  bottom: -28px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #333;
  z-index: 1;
}

.fukidashi-nocode-strong {
  margin: 0;
  padding: 0;
  font-weight: bold;
}

@media (max-width: 767px){/*767px以下の時 */
.parentfukidashi {font-size: 20px;}
}




/*-------------------------------------------
お客様の声
-------------------------------------------*/
#voice .voice_box{background: white;box-shadow: 4px 4px 16px #0000004d; border-radius: 10px; padding: 30px 20px; margin: 0 auto 20px;}
#voice .voice_box .voice_boxTitle{margin-bottom: 30px;}
#voice .voice_box .voice_text1{font-size: 20px; padding: 13px 0px 14px 10px;}
#voice .voice_box .voice_text2{font-weight: bold;}
.voice_boxTitle .col-3{padding: 0px 0;}
.voice_boxTitle .col-9{padding: 0px 0;}
.voice_boxTitle .col-3 img{border-radius: 50px;}
.voice_boxTitle .row{margin: 0;}

/*-------------------------------------------
ご利用の流れ
-------------------------------------------*/
#flow p{margin: 0;}
#flow .flow_box{padding-top: 60px; margin:0 auto 20px; max-width: 900px;}
#flow .flow_box .flow_num{border: solid 1px black; border-radius: 100%; width: 120px; height: 120px;}
#flow .flow_box .flow_num1,#flow .flow_box .flow_num2{text-align: center;}
#flow .flow_box .flow_num1{padding-top: 10px;}
#flow .flow_box .flow_num1{font-size: 20px; font-weight: bold;}
#flow .flow_box .flow_num2{font-size: 50px; font-weight: bold;}
#flow .flow_box .flow_text{padding-left: 20px;}
#flow .flow_box .flow_text1{font-size: 21px; margin-bottom: 20px; padding-top: 10px; font-weight: bold;}
#flow .flow_box .flow_text2{color: #999999;}
#flow .flow_box .flow_text3{padding-top: 30px;}
#flow .flow_box.first_box{background: none; padding-top: 10px;}
/*-------------------------------------------
よくあるご質問
-------------------------------------------*/
#question{background: #f0f0eb; padding: 100px 0;}
.questionParent{background: white; padding: 50px;}
#question .h2Title{text-align: center; margin: 0 0 50px;}
#question .h2Title .h2TitleEn{font-family: 'Montserrat'; font-size: 40px;}
#question .h2Title h2{font-size: 22px; font-weight: bold; border-bottom: solid 1px black; display: inline-block;}
.questionBox{padding: 30px 0 20px;}
.questionTitle{font-size: 20px; font-weight: bold;}
.qStrong{font-family: 'Montserrat'; margin: 0 10px 0 0;}
/*-------------------------------------------
キャンペーン
-------------------------------------------*/
#baner .banerBox{background: #fada27; color: #11295a; text-align: center; max-width: 900px; margin: 100px auto; padding: 60px 90px;}
#baner .banerBox p{font-weight: bold; margin: 0;}
#baner .banerBox .banerL{border-radius: 20px; border:10px #11295a solid; padding: 10px 0;}
#baner .banerBox .banerL .banerL1{font-size: 20px;}
#baner .banerBox .banerL .banerL2{font-size: 50px;}
#baner .banerBox .banerR .banerR1{font-size: 30px;}
#baner .banerBox .banerR .banerR2{font-size: 50px;}
#baner .banerBox .banerR .banerR3{font-size: 20px;}

/*-------------------------------------------
お問合せ
-------------------------------------------*/
.mainContact{background: white; padding: 40px 20px 10px;}
.mainContact textarea,.mainContact input,.mainContact select,.mainContact{font-size: 14px;}
.commonContact .hissu{color: white; padding: 2px 4px; font-size: 12px; margin: 0 4px 4px 0; display: inline-block;}
.commonContact .wpcf7-form-control{padding: 4px; width: 100%;}
.commonContact .wpcf7-form-control.wpcf7-checkbox,.psContact .wpcf7-form-control.wpcf7-checkbox{padding: 0px; height: 0px;}
.commonContact .wpcf7-form-control.wpcf7-submit{display: block; margin: 0 auto; color: white; padding: 10px 0; border-radius: 2px; max-width: 300px; width: 100%; text-align: center;}
.commonContact input,.commonContact textarea,.commonContact select{border: solid 1px #C0C0C0;} 

.commonContact .mvformTit{color: white; padding: 10px; text-align: center; font-size: 16px; font-weight: bold; margin: -60px 0 20px;}
.commonContact .mvformTit i{display: inline-block; font-size: 20px; margin: 0 10px;}
.commonContact .mvformTit i.leftline{transform:rotate(7deg);}
.commonContact .mvformTit i.rightline{transform:rotate(97deg);}
.commonContact .mvfromTitSoshoku{display: inline-block; max-width: 187px;}

/*-------------------------------------------
お問合せ popularStar
-------------------------------------------*/
.psContact{padding: 0 0 15px; border-radius: 10px;}
.psContact .mvformTit{border-radius: 10px 10px 0 0; margin: 0 0 30px; padding: 35px 20px 30px; text-align: center; font-size: 20px; color: white; font-weight: bold;}
.psContact .wpcf7-form-control.wpcf7-submit{display: block; margin: 0 auto; color: white; padding: 20px 0 18px; border-radius: 30px; width: 90%; text-align: center; font-size: 20px; font-weight: bold; border: none; box-shadow: none;}
.psContact p,.psContact .towColumn{margin: 20px 30px;}
.psContact .towColumn p{margin: 0px 0px; padding: 0 5px 0 0;}
.psContact .hissu{color: #ff3030; border: solid 1px #ff3030; padding: 2px 4px; font-size: 12px; margin: 0 4px 4px 0; display: inline-block;}
.psContact .wpcf7-form-control{padding: 4px; width: 100%;}
.commonContact textarea,.commonContact select,.psContact input.wpcf7-form-control,.psContact select.wpcf7-form-control,.psContact textarea.wpcf7-form-control{border: solid 1px #C0C0C0; border-radius: 5px; box-shadow: 1px 1px 2px #e3e2e2 inset; padding: 10px;} 

/*-------------------------------------------
お問い合わせ
-------------------------------------------*/
#form{font-weight: bold;}
#form .contact_box{max-width: 900px;margin: 0 auto;}
#form .contact_box div{margin-bottom: 30px;}
#form .contact_box div span.hissu{float: right; margin-right: 30px; padding: 4px; font-size: 13px; color: white;}
#form .contact_box div .wpcf7-form-control{padding: 4px; width: 100%;}
#form .contact_box div .wpcf7-form-control.wpcf7-submit{display: block; margin: 0 auto; background: black; color: white; padding: 10px 0; border-radius: 2px; width: 300px; text-align: center; box-shadow: 1px 1px 10px #0000002b;}

/*-------------------------------------------
メインビジュアル下実績
-------------------------------------------*/
.indexCustomer{background: #fafafa; padding: 40px 0;}
.indexCustomer.indexCustomerMedia{background: white;}
.indexCustomerOutline{font-size: 18px; text-align: center; margin: 0;}
.indexCustomerNumber{font-weight: bold;}
.slider{max-width:600px; margin: 0px auto;}
.slider .slick-slide img{margin: 0 auto;}
.slick-prev, .slick-next{top: 40%;}
.slick-prev::before {content: url(../img/btn_01.png)!important;}
.slick-next::before {content: url(../img/btn_02.png)!important;}


/*-------------------------------------------
フッター
-------------------------------------------*/
footer .copyright{background: black; color: white; text-align: center; padding: 15px; margin: 0px 0 0; font-size: 12px;}


/*-------------------------------------------
nocode関連
-------------------------------------------*/
/*nocode_シナリオ*/
.scenario .nocode_scenarioh2{text-align: left; font-size: 36px; margin: 0 0 50px; font-weight: bold;}
.nocode_scenarioStep{font-size: 18px; font-weight: bold; display: inline-block; padding-bottom: 10px; border-bottom: solid 2px #333;}
.textwhite .nocode_scenarioStep{border-color: white;}
.parent_ncstep{text-align: center;}
.marker-yellow-nocode-strong.mainScenarioMarker{margin: 0px 0 20px; font-weight: bold;}
.scenarioValue .nocode_scenarioStep{color: white; border-color: white;}
.scenarioValue .scenario .nocode_scenarioh2{text-align: center;}
.nocode_valueHead{color: white; text-align: center; font-size: 22px; font-weight: bold;}
.nocode_valueArticle{color: white; text-align: center;}
.scenarioLogic .nocode_scenario{padding: 100px 10px 0px 10px;}
.nocode_logics{padding: 100px 0;}
.nocode_logics:first-child{padding-top: 0px;}
.nocode_logics:nth-child(even){background: #f8f8f8;}
.nocode_logics .fnwrap{margin-top:0;} 
.nocode_logics .featureNumNocode{min-width: 150px; color: white; border:none; padding: 7px 10px; background: black;}
.nocode_logics .featureNumH3{font-size: 30px;}
.scenarioIssue{border-radius: 10px; border:solid 2px #333; padding: 22px 10px; min-width: 120px; max-width: 100%; font-size: 24px; box-sizing: border-box; margin: 40px 0; font-weight: bold; text-align: center;}
.textwhite .scenarioIssue{border:solid 2px #fff;}
@media (max-width: 767px){/*767px以下の時 */
.nocode_scenarioStep{font-size: 15px;}
.scenario .nocode_scenarioh2{font-size: 25px;}
.scenarioProblem.featureDetails h3{font-size: 20px;}
.nocode_valueHead{font-size: 20px;}
.nocode_logics .featureNumNocode{font-size: 15px;}
.nocode_logics .featureNumH3{font-size: 23px;}
.featureDetails h4, .successStory h4{font-size: 18px;}
.scenarioIssue{font-size: 20px;}
.commonLayoutA h2.nocodeH2En{font-size: 50px;}
.commonLayoutA h2.nocodeH2En span.nocodeH2Ja{font-size: 15px;}
.nocode_ctaTit{font-size: 25px;}

}



/*-------------------------------------------
SP
-------------------------------------------*/
@media (max-width: 1000px){/*767px以下の時 */
  #mainVisual{background-position: center top!important;}
  /*料金*/
  .firstRow a.priceBtn{font-size: 14px; padding: 10px;}
  /*キャンペーン*/
  #baner .banerBox{padding: 60px 10px; margin-bottom: 40px;}
  #baner .banerBox .banerL{padding: 10px 0;margin-bottom: 30px;}
  #baner .banerBox .banerL .banerL2{font-size: 30px;}
  #baner .banerBox .banerR .banerR1{font-size: 30px;}
  #baner .banerBox .banerR .banerR2{font-size: 45px;} 

}

@media (max-width: 767px){/*767px以下の時 */
  .popularBadge li{margin: 0 5px 20px; font-size: 10px; padding: 0 25px;}
  .popularBadge li span.badgeStrong{}
  header .container{padding: 0;}
  .mainContact{margin: 0 0 0 0;}
  /*改行*/
  .brspTopMargin{display: inline-block; margin: 20px 0 0;}
  .brTopSp::before {content: "\A"; white-space: pre;}
  .brDoubleSp::before,.brDoubleSp::after {content: "\A"; white-space: pre;}
  /*CTA-縦書き*/
  .letterSmall .ctaLetter{font-size: 16px;}
  .letterSmall{padding: 50px 0px;}
  /*共通（commonLayoutA）*/
  .commonLayoutA h2.claH2En span.claH2Ja{margin-left: 0px;}
  /*料金*/
  .firstRow .planJa{font-size: 18px;}
  .firstRow .priceStrong{font-size: 22px;}
  .tSpMidashi{font-size: 12px; display: block; margin: 0 0 5px; font-weight: bold;}
  .d-none-table{display: none;}
  .d-view-table{display: block;}
  .thmidashi{text-align: left;}
  /*メディア掲載実績*/
  #media ul li{width: 50%;}
  /*よくあるご質問*/
  .questionParent{padding: 50px 30px;}
  /*ご利用の流れ*/
  #flow{padding: 40px 0; margin-bottom: 0px;}
  #flow .flow_box .flow_num{margin: 0 auto;}
  #flow .flow_box .flow_text1{text-align: center;}
  #flow .flow_box .flow_text{padding: 10px;}
  #flow .flow_box{background: none!important; padding-top: 0; margin: 0 0 50px;}
  /*実績*/
  #performance {padding-bottom: 0px;}
  .performanceIn{background-position: center top!important; background-repeat: repeat-y!important;}
  #performance .perfo_box .perfo_text4{text-align: center;}
  #performance .perfo_content td{display: block;width: 100%;}
  .senarioPerform {padding-bottom: 0px; background-position: center top!important; background-repeat: repeat-y!important;}
  .senarioPerform .perfo_box .perfo_text4{text-align: center;}
  .senarioPerform .perfo_content td{display: block;width: 100%;}
  .senarioJirei h3,.marker-yellow{background: linear-gradient(transparent 80%, #ffff66 80%); font-size: 20px;}
  .scenario h3{font-size: 22px;}

  /*お問い合わせ*/
  #form .contact_box div.col-md-5, #contact .contact_box div.col-md-7{margin: 0 0 5px;}
  #form .contact_box div span.hissu{float: left; margin-right: 10px; padding: 2px 4px;}
  #form span.wpcf7-list-item{display: block;}
  #form .contact_box div{margin-bottom: 20px;}
}
@media (max-width: 991px){/*374px以下の時 */
  /*動画*/  
  #scenario iframe,#feature iframe,.mainMovieInsert iframe,.mainMovieH1Insert iframe{width: 100%; height: 52vw;}
}
@media (max-width: 374px){/*374px以下の時 */
  .mvformTit i.leftline,.mvformTit i.rightline{display: none;}

}



/*-------------------------------------------
mvTech01
-------------------------------------------*/
.mvTech01 p{margin: 0;}
.mvTech01 h1{font-size: 30px; color: white; font-style: italic;}
.mvt01H1{display: inline-block; padding: 2px 10px; margin: 5px 0; background: #173a5e;}
.mvt01H1 .mvtechStrong{font-size: 50px;}
.mvt01H1 strong{font-size: 50px; font-weight: normal;}
.mvTech01 ul{overflow: hidden;}
.mvTech01 ul li{float: left; padding: 10px;}
.mvTech01 ul li span.mvtechStrong{font-size: 25px; font-weight: bold;}
p.mvt01Hosoku{font-size: 10px;}
.mvt01Price{color: #4ef5fd; font-size: 35px; font-style: italic;}
.mvt01Price .mvtechStrong{font-size: 120px;}
.mvt01Price strong{font-size: 120px; font-weight: normal;}
.mvt01Cta{text-align: center; display: block; max-width: 480px; margin: 0 auto; color: white; font-size: 24px; background: linear-gradient(70deg, #339a8c, #3c75b4);  padding: 30px; border-radius: 50px;}
.mvTech01{color: white; margin: 30px 0 0;}



@media (max-width: 767px){/*767px以下の時 */
.mvTech01{padding: 20px 0 50px;}
.mvTech01 h1{font-size: 20px;}
.mvt01H1 .mvtechStrong{font-size: 28px;}
.mvTech01 ul{margin: 0 0 10px;}
.mvTech01 ul li{float: none; padding: 0px;}
.mvTech01 p.mvt01Price{font-size: 30px; text-align: center; margin: 30px 0 0;}
.mvTech01 p.mvt01Price .mvtechStrong{font-size: 60px; font-weight: bold;}
.mvt01Cta{text-align: center; display: block; max-width: 480px; margin: 0 auto; color: white; font-size: 24px; background: linear-gradient(70deg, #339a8c, #3c75b4);  padding: 30px; border-radius: 50px;}
}

/*-------------------------------------------
mvTech02
-------------------------------------------*/
.mvTech02Left{margin: 100px 0 0;}
.mvTech02Right{margin: 20px 0 0;}
.mvTech02Rightimg .mvImage{text-align: right;}
.mvTech02Right ul{overflow: hidden;}
.mvTech02Right ul li{float: right; text-align: center; font-size: 14px; line-height: 1.3; padding: 56px 20px; min-width: 170px; margin: 0 5px 0; background: url(img/mv_badge.png) no-repeat center center;}
.mvTech02Right ul li span.mvtechStrong{font-size: 30px; font-weight: bold;}
.mvTech02,.mvTech02Right{color: white;}
.mvTech02 h1{margin: 0 0 30px}
.mvt02H1{font-size: 35px; font-weight: normal; color: white;}
.mvt02Price{margin: 0 0 30px; color: #436983; font-size: 48px;}
.mvt02Price strong{font-size: 60px;}
.mvt02Cta{background: #436983; padding: 30px; display: block; max-width: 480px; text-align: center; color: white; font-size: 24px;}
.mvt02Hosoku{text-align: right; font-size: 12px; margin: 30px 0 0px;}
.mvTech02img{text-align: right; margin: 30px 0 0;}

@media (max-width: 767px){/*767px以下の時 */
.mvTech02Left{margin: 0px 0 0;}
.mvTech02 ul{max-width: 344px; margin: 0 auto;}
.mvTech02 ul li{margin: 0 1px 0;}
.mvt02H1{font-size: 28px;}
.mvt02Price{font-size: 40px;}
.mvt02Hosoku{font-size: 10px;}
}

/*-------------------------------------------
mvTech03
-------------------------------------------*/
.mvTech03{padding: 0 0 50px;}
.mvTech03 h1{font-size:40px; text-align: center; font-weight: normal; padding: 50px 0 0px}
.mvt03Price{margin: 0 0 20px; color: #f93db3; font-size: 48px; text-align: center;}
.mvt03Cta{background: #436983; padding: 30px; display: block; max-width: 480px; text-align: center; color: white; font-size: 24px; margin: 0 auto;}
.mvt03Hosoku{text-align: center; font-size: 12px; margin: 10px 0 0px;}
.mvTech03 ul{overflow: hidden; max-width: 340px; margin: 0 auto 30px;}
.mvTech03 ul li:first-child{float: left; text-align: center; font-size: 14px; line-height: 1.3; padding: 57px 0px; min-width: 170px; margin: 0 0px 0; background: url(img/mvtech_badge02.png) no-repeat center center;}
.mvTech03 ul li:last-child{float: left; text-align: center; font-size: 14px; line-height: 1.3; padding: 57px 0px; min-width: 170px; margin: 0 0px 0; background: url(img/mvtech_badge01.png) no-repeat center center; color: white;}
.mvTech03 ul li span.mvtechStrong{font-size: 30px; font-weight: bold;}


@media (max-width: 767px){/*767px以下の時 */
.mvTech03 h1{font-size:30px; padding: 30px 0 0px}
.mvt03Price{font-size: 40px; }
.mvt03Hosoku{font-size: 10px;}
}

@media (max-width: 767px){/*767px以下の時 */
#headBar{padding: 0 10px;}
#headBar .productNameDes{margin: 0 0 5px; font-size: 10px;}
.productName{font-size:24px;}

/* メイン */
.popularStar{padding: 30px 0 0;}
.popularStar h1.psH1{font-size: 35px; font-weight: bold;}
.popularStar h1 .psH1br,.mvTech02 h1 .mvt02H1 p{display: inline;}

/* バッチ */
.popularStarBadge{margin: 0 0 30px;}
.popularStarBadge li{float: none; display: block; margin: 0 0 10px;}
.popularStarBadge li span.badgeStrong{display: inline; padding: 0 0 0 10px;}
/* 料金とボタン */
.psPrice{margin: 0; font-size:24px;}
.psPrice span.mvtechStrong,.psPrice strong{font-weight: bold; font-size: 50px; margin: 0 5px;}
.mobileCenterPrice{text-align: center;}

/* 料金とボタン */
.mainImgInsert{text-align: center;}

.commonLayoutA h2.nocodeH2En{margin: 0 0 20px;}
.commonLayoutA{padding: 40px 0;}

}



.checkboxtemp span.wpcf7-list-item{display: block;}


/* MV画像制御 */
.onlyJpgTac{text-align: center; margin: 0px 0 0px;}
#mainVisual .onlyJpgTac img{border-radius: 0px;}