/* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
　10秒シミュレーション
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー */

/* share */
.cts-taiyoko .sim-area p { margin-bottom:0; color:#333333; }
.cts-taiyoko .sim-area h3 { font-size:18px; font-weight:bold; margin:0 0 14px 0; color:#333333; }
.cts-taiyoko .sim-area h3 span { font-size:11px; display:block; }
.cts-taiyoko .sim-area .simContents { background-color:#e5f2ff; margin-top:15px; border-radius:6px; padding:36px 21px 40px 21px; }
.cts-taiyoko .sim-area .simContents span { color:#333333; }
.cts-taiyoko .sim-area .simContents span span { color:#f62c11; margin-left:20px; }

/* エラー文言 */
.cts-taiyoko .sim-area .simContents .error-txt { color:#f62c11; margin:10px 0 0 90px; }

/* セレクトボックス */
.cts-taiyoko .sim-area .simContents .selectBox { position:relative; border-radius:6px; background:#ffffff; overflow:hidden; width:300px; }
.cts-taiyoko .sim-area .simContents .selectBox::after { content:''; position:absolute; top:1.5em; right:0.9em; width:0; height:0; padding:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:8px solid #0066cc; pointer-events:none; }
.cts-taiyoko .sim-area .simContents select { width:100%; padding-right:1em; cursor:pointer; text-indent:0.01px; text-overflow:ellipsis; border:none; outline:none; background:transparent; background-image:none; box-shadow:none; -webkit-appearance:none; appearance:none; padding:13px 38px 13px 25px; color:#333333; }
.cts-taiyoko .sim-area .simContents select::-ms-expand { display:none; }

.cts-taiyoko .sim-area .simContents .address > div { margin-left:90px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
.cts-taiyoko .sim-area .simContents .address > div > span:nth-of-type(1) { margin-right:20px; font-size:16px; }

.cts-taiyoko .sim-area .simContents .status { margin:39px 0 0; }
.cts-taiyoko .sim-area .simContents .status > div { margin-left:90px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
.cts-taiyoko .sim-area .simContents .status > div > span:nth-of-type(1) { margin-right:20px; font-size:16px; }

/* テキストボックス */
.cts-taiyoko .sim-area .simContents .area { margin:39px 0 0; }
.cts-taiyoko .sim-area .simContents .area > div { margin-left:90px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
.cts-taiyoko .sim-area .simContents .area > div input { color:#333333; padding:13px; border-radius:6px; width:300px; margin-right:14px; -webkit-appearance:none; border:none; text-align:left; font-size:16px; }
.cts-taiyoko .sim-area .simContents .area > div > span { display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:inline-block; }
.cts-taiyoko .sim-area .simContents .area > div > span:nth-of-type(1) { margin-right:20px; font-size:16px; }
.cts-taiyoko .sim-area .simContents .area > div > span:nth-of-type(3) { margin-left:20px; font-size:14px; margin-top:3px; font-weight:normal; }

/* ボタン */
.cts-taiyoko .sim-area .simContents .btn { background-color:transparent; padding:0; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; margin-top:41px; }
.cts-taiyoko .sim-area .simContents .btn:before { display:none; }
.cts-taiyoko .sim-area .simContents .btn a { text-decoration:none; background-color:#0066cc; display:block; padding:17px 0 15px; color:#fff; border-radius:8px; width:300px; }

/* 結果 */
.cts-taiyoko .sim-area .answer { position:relative; padding-top:71px; }
.cts-taiyoko .sim-area .answer.dispnone { display:none; }
.cts-taiyoko .sim-area .answer:before { content:""; width:70px; height:35px; display:block; background:url("/~/media/SolKepco/taiyoko/images/ico_simArrow.png") no-repeat center; background-size:contain; position:absolute; top:19px; left:calc(50% - 35px); }
.cts-taiyoko .sim-area .answer .result > p { text-align:center; font-size:12px; margin-top:17px; }
.cts-taiyoko .sim-area .answer .result > p.co2 { font-weight:bold; font-size:24px; line-height:1; margin-top:0; }
.cts-taiyoko .sim-area .answer .result > p.co2 > span { display:block; font-size:24px; color:#0066cc; margin:0 0 7px 0; }
.cts-taiyoko .sim-area .answer .result > p.co2 > span span { font-size:50px; margin:0 5px; }
.cts-taiyoko .sim-area .answer .result > p.cost { font-weight:bold; font-size:24px; line-height:1; margin-top:0; }
.cts-taiyoko .sim-area .answer .result > p.cost > span { display:block; font-size:24px; color:#f62c11; margin:0 0 7px 0; }
.cts-taiyoko .sim-area .answer .result > p.cost > span span { font-size:50px; margin:0 5px; }
.cts-taiyoko .sim-area .answer .result > p.eoSentence { font-weight:bold; font-size:24px; line-height:1; margin-top:14px; }
.cts-taiyoko .sim-area .answer .result > p.atComment > span { display:block; }
.cts-taiyoko .sim-area .answer .result > p.text { font-size:32px; font-weight:bold; }
.cts-taiyoko .sim-area .answer .result > p.text + span { margin-left:0; }
.cts-taiyoko .sim-area .answer .cvArea { background-color:#e5f2ff; margin-top:16px; padding:33px 0 32px 0; }
.cts-taiyoko .sim-area .answer .cvArea p { font-size:20px; font-weight:bold; }

.cts-taiyoko .btn.btn-sim:before { background-image:url(/~/media/SolKepco/images/common/icon/line-sim.png); }

/* コストイメージ */
.cts-taiyoko .cost-image + ul { margin-top: 25px; text-align: right; }

/*補助金活用もおまかせ！*/
.cts-taiyoko .point-area { background: #e8f2fd; border-radius: 10px; padding: 5px 20px 20px; margin: 0; }
.cts-taiyoko .point-area dl { margin: 0 0 0 20px; }
.cts-taiyoko .point-area dl dt { position: relative; font-size: 20px; color: #3c68b8; padding-top: 15px; font-weight: bold; }
.cts-taiyoko .point-area dl dt::before { position: absolute; content: "▶"; color: #ec8031; left: -1.7em; top: 2.3em; font-size: 50%; }

.cts-taiyoko .ex-area { background: #e8f2fd; border-radius: 10px; padding: 20px; margin-top: 20px; }
.cts-taiyoko .ex-area .ex-inner { background: #fff; border-radius: 8px; padding: 30px 30px 25px; width: 100%; }
.cts-taiyoko .ex-area .ex-inner h3 { margin: 0;}
.cts-taiyoko .ex-area .ex-inner .f-wrap > div { width: 48% !important; }
.cts-taiyoko .ex-area .ex-inner .f-wrap > div h4 { font-size: 20px; color: #3c68b8; font-weight: bold; }
.cts-taiyoko .ex-area .ex-inner .f-wrap > div h4 + div { text-align: center; }
.cts-taiyoko .ex-area .ex-inner .f-wrap > div table { margin-top: 10px; }
.cts-taiyoko .ex-area .ex-inner .f-wrap > div table th { background: #ecedec; font-size: 96%; }
.cts-taiyoko .ex-area .ex-inner .f-wrap > div table td { font-size: 84%; }

@media screen and (max-width:767px) { 
  
  /* share */
  .cts-taiyoko .sim-area { margin-left:0; margin-right:0; }
  .cts-taiyoko .sim-area h2 { margin-left:20px; margin-right:20px; } 
  .cts-taiyoko .sim-area .sec-contents { margin:0; } 
  .cts-taiyoko .sim-area .sec-contents > p { margin-left:20px; margin-right:20px; } 
  .cts-taiyoko .sim-area .sec-contents h3 { font-size:18px; margin:0 0 13px 0; } 
  .cts-taiyoko .sim-area .sec-contents h3 span { padding-left:0; } 
  .cts-taiyoko .sim-area .simContents span span { margin-left:14px; }
  .cts-taiyoko .sim-area .sec-contents .simContents { background-color:#e5f2ff; margin-top:15px; border-radius:0; padding:36px 20px 40px; } 

  /* エラー文言 */
  .cts-taiyoko .sim-area .sec-contents .simContents .error-txt { margin-left:0; font-size:12px; } 
 
  /* セレクトボックス */
  .cts-taiyoko .sim-area .sec-contents .simContents .selectBox::after { top:1.25em; }
  .cts-taiyoko .sim-area .sec-contents .simContents .selectBox { text-align:center; width:55%;text-align:center; text-align-last:center; -moz-text-align-last:center; }
  .cts-taiyoko .sim-area .sec-contents .simContents select { padding:8px 38px 8px 14px; font-size:16px; }

  .cts-taiyoko .sim-area .sec-contents .simContents .address > div { margin-left:0; -ms-flex-wrap:wrap; flex-wrap:wrap; }
  .cts-taiyoko .sim-area .sec-contents .simContents .address > div > span:nth-of-type(1) { font-size:15px; margin-right:14px; }

  .cts-taiyoko .sim-area .sec-contents .simContents .status > div { margin-left:0; -ms-flex-wrap:wrap; flex-wrap:wrap; }
  .cts-taiyoko .sim-area .sec-contents .simContents .status > div > span:nth-of-type(1) { font-size:15px; margin-right:14px; }
  
  /* テキストボックス */
  .cts-taiyoko .sim-area .sec-contents .simContents .area > div { margin-left:0; -ms-flex-wrap:wrap; flex-wrap:wrap; }
  .cts-taiyoko .sim-area .sec-contents .simContents .area > div input { padding:8px 13px 8px; text-align:center; width:55%; margin-right:5px; font-size:16px; } 
  .cts-taiyoko .sim-area .sec-contents .simContents .area > div > span { font-size:15px; } 
  .cts-taiyoko .sim-area .sec-contents .simContents .area > div > span:nth-of-type(1) { margin-right:15px; } 
  .cts-taiyoko .sim-area .sec-contents .simContents .area > div > span:nth-of-type(3) { display:block; width:100%; margin:8px 0 0 0; } 
  .cts-taiyoko .sim-area .sec-contents .simContents .area .error-txt { margin-top:2px; } 
 
  /* ボタン */
  .cts-taiyoko .sim-area .sec-contents .simContents .btn { margin-top:34px; } 
  .cts-taiyoko .sim-area .sec-contents .simContents .btn:before { display:none; } 
  .cts-taiyoko .sim-area .sec-contents .simContents .btn a { text-decoration:none; background-color:#0066cc; display:block; padding:11px 0 11px; color:#fff; border-radius:8px; width:300px; font-size:15px; } 
 
  /* 結果 */
  .cts-taiyoko .sim-area .sec-contents .answer { position:relative; padding-top:65px; margin-left:20px; margin-right:20px; } 
  .cts-taiyoko .sim-area .sec-contents .answer.dispnone { display:none; } 
  .cts-taiyoko .sim-area .sec-contents .answer:before { content:""; width:70px; height:35px; display:block; background:url("/~/media/SolKepco/taiyoko/images/ico_simArrow.png") no-repeat center; background-size:contain; position:absolute; top:17px; left:calc(50% - 35px); } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p { text-align:center; margin-top:17px; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.co2 { font-size:21px; margin-top:0; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.co2 > span { font-size:21px; margin:0 0 5px 0; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.co2 > span span { font-size:40px; }
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.cost { font-size:21px; margin-top:0; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.cost > span { font-size:21px; margin:0 0 5px 0; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.cost > span span { font-size:40px; }
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.eoSentence { font-size:21px; margin-top:10px; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.text { font-size:21px; font-weight:bold; line-height:1.3; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result > p.text + span { margin-left:0; } 
  .cts-taiyoko .sim-area .sec-contents .answer .result .btn { width:82%; } 
  .cts-taiyoko .sim-area .sec-contents .answer .cvArea { margin-top:16px; padding:18px 32px 12px; } 
  .cts-taiyoko .sim-area .sec-contents .answer .cvArea p { margin-top:12px !important; } 
  .cts-taiyoko .sim-area .sec-contents .answer .cvArea p:nth-of-type(1) { font-size:18px; line-height:1.3; margin-top:0 !important; } 
  
  /*補助金活用もおまかせ！*/
  .cts-taiyoko .point-area { padding: 5px 15px 15px; }
  .cts-taiyoko .point-area dl dt { font-size: 16px; padding-top: 10px; }

  .cts-taiyoko .ex-area { padding: 10px; }
  .cts-taiyoko .ex-area .ex-inner { padding: 20px 20px 40px; }
  .cts-taiyoko .ex-area .ex-inner .f-wrap > div { margin-bottom: 0; }
  .cts-taiyoko .ex-area .ex-inner .f-wrap > div h4 { font-size: 14px; }
  .cts-taiyoko .ex-area .ex-inner .f-wrap > div { width: 100% !important; }
  .cts-taiyoko .ex-area .ex-inner .f-wrap > div table th { padding: 5px 10px; display: inline-block; width: 100%; text-align: left; }
  .cts-taiyoko .ex-area .ex-inner .f-wrap > div table td { display: inline-block; width: 100%; }

}