@charset "UTF-8";
/****************** Scaffolding *******************/
#ymsem * {
  box-sizing: border-box;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-feature-settings: 'palt';
}

/******************* Typography *******************/
#ymsem p {
  font-size: 14px;
  line-height: 1.5;
}

/**************** Utility classes ****************/
/*
 Margin ------------------------------------
 */
#ymsem .mrT0 {
  margin-top: 0px;
}

#ymsem .mrT1 {
  margin-top: 1px;
}

#ymsem .mrT2 {
  margin-top: 2px;
}

#ymsem .mrT3 {
  margin-top: 3px;
}

#ymsem .mrT4 {
  margin-top: 4px;
}

#ymsem .mrT5 {
  margin-top: 5px;
}

#ymsem .mrT6 {
  margin-top: 6px;
}

#ymsem .mrT7 {
  margin-top: 7px;
}

#ymsem .mrT8 {
  margin-top: 8px;
}

#ymsem .mrT9 {
  margin-top: 9px;
}

#ymsem .mrT10 {
  margin-top: 10px;
}

#ymsem .mrT11 {
  margin-top: 11px;
}

#ymsem .mrT12 {
  margin-top: 12px;
}

#ymsem .mrT13 {
  margin-top: 13px;
}

#ymsem .mrT14 {
  margin-top: 14px;
}

#ymsem .mrT15 {
  margin-top: 15px;
}

#ymsem .mrT16 {
  margin-top: 16px;
}

#ymsem .mrT17 {
  margin-top: 17px;
}

#ymsem .mrT18 {
  margin-top: 18px;
}

#ymsem .mrT19 {
  margin-top: 19px;
}

#ymsem .mrT20 {
  margin-top: 20px;
}

#ymsem .mrB0 {
  margin-bottom: 0px;
}

#ymsem .mrB1 {
  margin-bottom: 1px;
}

#ymsem .mrB2 {
  margin-bottom: 2px;
}

#ymsem .mrB3 {
  margin-bottom: 3px;
}

#ymsem .mrB4 {
  margin-bottom: 4px;
}

#ymsem .mrB5 {
  margin-bottom: 5px;
}

#ymsem .mrB6 {
  margin-bottom: 6px;
}

#ymsem .mrB7 {
  margin-bottom: 7px;
}

#ymsem .mrB8 {
  margin-bottom: 8px;
}

#ymsem .mrB9 {
  margin-bottom: 9px;
}

#ymsem .mrB10 {
  margin-bottom: 10px;
}

#ymsem .mrB11 {
  margin-bottom: 11px;
}

#ymsem .mrB12 {
  margin-bottom: 12px;
}

#ymsem .mrB13 {
  margin-bottom: 13px;
}

#ymsem .mrB14 {
  margin-bottom: 14px;
}

#ymsem .mrB15 {
  margin-bottom: 15px;
}

#ymsem .mrB16 {
  margin-bottom: 16px;
}

#ymsem .mrB17 {
  margin-bottom: 17px;
}

#ymsem .mrB18 {
  margin-bottom: 18px;
}

#ymsem .mrB19 {
  margin-bottom: 19px;
}

#ymsem .mrB20 {
  margin-bottom: 20px;
}

/*
 Backgorund color --------------------------
 */
#ymsem .bg-fff {
  background-color: #fff;
}
#ymsem .bg-fffcee {
  background-color: #fffcee;
}

/*
 Text align --------------------------------
 */
#ymsem .text-right {
  text-align: right;
}
#ymsem .text-center {
  text-align: center;
}
#ymsem .text-left {
  text-align: left;
}

/*
 Font weight -------------------------------
 */
#ymsem .weight-bold {
  font-weight: bold !important;
}
#ymsem .weight-normal {
  font-weight: normal !important;
}

/*
 Font color --------------------------------
 */
#ymsem .text-f00 {
  color: #f00;
}

/*
 Font size ---------------------------------
 */
#ymsem .size-20 {
  font-size: 20px;
  line-height: 1.5;
}
#ymsem .size-14 {
  font-size: 14px;
  line-height: 1.5;
}
#ymsem .size-13 {
  font-size: 13px;
  line-height: 1.5;
}
#ymsem .size-12 {
  font-size: 12px;
  line-height: 1.5;
}
#ymsem .size-10 {
  font-size: 10px;
  line-height: 1.5;
}

/*
 Floats ------------------------------------
 */
#ymsem .clearfix:before, #ymsem .clearfix:after {
  content: " ";
  display: table;
}
#ymsem .clearfix:after {
  clear: both;
}
#ymsem .center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
#ymsem .pull-right {
  float: right !important;
}
#ymsem .pull-left {
  float: left !important;
}
#ymsem .clearboth {
  clear: both;
}

/*
 Lists -------------------------------------
 */
#ymsem .list-unordered {
  margin: 0;
  padding-left: 1em;
  font-size: 12px;
  line-height: 1.8;
}

/*
 Numerical verification --------------------
 Lists -------------------------------------
 */
#ymsem .numericVerify {
  margin: 0;
  padding-left: 1em;
  font-size: 11px;
  line-height: 1.5;
}

/******************** Message ********************/
/*
 Balloon -----------------------------------
 */
.message-container-inner {
  width: calc(100% - 20px);
}
.message-container-inner .message-balloon {
  width: calc(100% - 95px);
}

/********************* Tables *********************/
#ymsem table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  line-height: 1.5;
}
#ymsem table tbody tr th {
  width: 50%;
  padding: 5px 5px 5px 8px;
  font-weight: normal;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid #d8d8da;
}
#ymsem table tbody tr th.border-top {
  border-bottom: none;
  border-top: 1px solid #d8d8da;
}
#ymsem table tbody tr th.border-right {
  border-right: 1px solid #d8d8da;
}
#ymsem table tbody tr th.nowrap {
  /* thの幅を常に最小に */
  width: 50px;
  white-space: nowrap;
}
#ymsem table tbody tr td {
  vertical-align: middle;
  font-weight: bold;
  padding: 5px 8px 5px 5px;
  text-align: right;
  border-bottom: 1px solid #d8d8da;
}
#ymsem table tbody tr td.num {
  font-size: 12px;
  text-align: right;
}
#ymsem table tbody tr td .yen,
#ymsem table tbody tr td .unit {
  padding-left: 2px;
  font-size: 10px;
  line-height: 1.5;
}
#ymsem table tbody tr td.border-top {
  border-bottom: none;
  border-top: 1px solid #d8d8da;
}
#ymsem .table-border-top tbody tr th,
#ymsem .table-border-top tbody tr td {
  border-bottom: none;
  border-top: 1px solid #d8d8da;
}

/******************** Wrapper *********************/
#ymsem .wrapper01 {
  padding: 11px 13px;
  background-color: #fff0f5;
}

/*********** Insertion statement / Title **********/
#ymsem .insert-txt01 {
  margin-bottom: 8px;
}
#ymsem .insert-txt02 {
  /* 下に注釈あり */
  margin-bottom: 4px;
}
#ymsem .insert-txt03 {
  /* 下にP + 空白あり */
  margin-bottom: 9px;
}
#ymsem .insert-txt04 {
  /* 下にデーター使用量あり */
  margin-bottom: -5px;
}
#ymsem .insert-txt04 + .insert-txt04-data {
  margin-bottom: -2px;
}
#ymsem .insert-txt05 {
  /* 下に現在日時あり */
  margin-bottom: 1px;
}
#ymsem .insert-txt05 + .insert-txt05-date {
  margin-bottom: 12px;
}
#ymsem .ttl01 {
  font-size: 14px;
  font-weight: bold;
}

/******************** Total num ******************/
#ymsem .total-num {
  font-weight: bold;
  text-align: right;
  background-color: #fff;
  border-top: 1px solid #d8d8da;
  border-bottom: 1px solid #d8d8da;
  font-size: 20px;
  line-height: 1.5;
  padding: 2px 8px;
}
#ymsem .total-num .yen {
  padding-left: 2px;
  font-size: 12px;
  line-height: 1.5;
}
#ymsem .total-num-flex {
  font-weight: bold;
  text-align: right;
  background-color: #fff;
  border-top: 1px solid #d8d8da;
  border-bottom: 1px solid #d8d8da;
  display: flex;
  justify-content: space-between;
  padding: 7px 8px 3px;
  align-items: center;
}
#ymsem .total-num-flex .flex-item .total-num-flex-ttl {
  padding: 0 0 3px;
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
}
#ymsem .total-num-flex .flex-item .total-num-flex-total {
  font-size: 16px;
  line-height: 1.5;
}
#ymsem .total-num-flex .flex-item .total-num-flex-total .yen {
  padding-left: 2px;
  font-size: 10px;
  line-height: 1.5;
}
#ymsem .total-num-flex-normal {
  display: flex;
  align-items: center;
}
#ymsem .total-num-flex-normal .flex-item .total-num-flex-ttl {
  padding: 0 12px 0 0;
  font-size: 12px;
  line-height: 1.5;
}
#ymsem .total-num-flex-normal .flex-item .total-num-flex-total {
  font-size: 12px;
  line-height: 1.5;
}
#ymsem .total-num-flex-normal .flex-item .total-num-flex-total .yen {
  padding-left: 2px;
  font-size: 12px;
  line-height: 1.5;
}
#ymsem .total-num-block {
  font-weight: bold;
  text-align: right;
  background-color: #fff;
  border-top: 1px solid #d8d8da;
  border-bottom: 1px solid #d8d8da;
  padding: 1px 8px 0;
}
#ymsem .total-num-block .total-num-block-ttl {
  padding: 0 0 2px;
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
}
#ymsem .total-num-block .total-num-block-total {
  padding: 0 0 2px;
  font-size: 20px;
  line-height: 1.5;
}
#ymsem .total-num-block .total-num-block-total .yen {
  padding-left: 2px;
  font-size: 12px;
  line-height: 1.5;
}

/************** Background fill text *************/
#ymsem .exclamation01 {
  display: inline;
  padding: 4px 4px 4px 20px;
  color: #fff;
  background-color: #f00;
  background-image: url(https://faq.api.softbank.jp/images/Chat/YM/icon_exclamation_ym.png);
  background-position: 7px 50%;
  background-size: 6px;
  background-repeat: no-repeat;
}
#ymsem .bg-fill-gray01 {
  display: inline-block;
  border-radius: 2px;
  padding: 0 5px;
  font-size: 12px;
  font-weight: normal;
  color: #fff;
  text-align: center;
  background-color: #808080;
  white-space: nowrap;
}

/************** Emphasis information *************/
#ymsem .em-info {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  line-height: 0;
}
#ymsem .em-info .em-info-ttl {
  flex-basis: auto;
}
#ymsem .em-info .em-info-txt {
  width: 100%;
  padding-left: 7px;
  text-align: left;
}

/********************* Notes *********************/
#ymsem .note01 {
  font-size: 10px;
  line-height: 1.5;
  padding-left: 1.1em;
  text-indent: -1.15em;
}
#ymsem .note01:before {
  content: "※";
  display: inline;
  margin-right: 0.2em;
}

/*************** Page specific CSS ***************/
/*
 bill-001.html ------------------------------
 */
#ymsem.bill-001 .wrapper01 table tbody tr th.bg-icon {
  padding-left: 25px;
  background-repeat: no-repeat;
  background-size: 20px;
  background-position: 0 50%;
  padding-left: 2em !important;
}
#ymsem.bill-001 .wrapper01 table tbody tr th.phone {
  background-image: url(https://faq.api.softbank.jp/images/chat/icon_phone.png);
}
#ymsem.bill-001 .wrapper01 table tbody tr th.pcnet {
  background-image: url(https://faq.api.softbank.jp/images/Chat/YM/icon_pcnet_ym.png);
}
#ymsem.bill-001 .wrapper01 table tbody tr th.denki {
  background-image: url(https://faq.api.softbank.jp/images/chat/icon_denki.png);
}
#ymsem.bill-001 .wrapper01 table tbody tr th img {
  max-width: 20px;
  max-height: 20px;
  margin: 0 3px;
  vertical-align: middle;
}