@charset "UTF-8";
/*------------------------------
端末一覧、端末末端共通IMG(PC SP共通)
 *------------------------------*/
/*------------------------------
端末末端/一覧 共通カラーリスト(PC SP共通)
---------------------------------*/
/*------------------------------
 * sideContents
 *------------------------------*/
@import url(https://fonts.googleapis.com/css?family=Oswald:400,700);
.m-sidebtn {
  margin-bottom: 22px;
}

.m-sidebtn__list {
  border-top: 1px solid #e1e3e6;
  border-right: 1px solid #e1e3e6;
  border-left: 1px solid #e1e3e6;
}

.m-sidebtn__list:last-child {
  border-bottom: 1px solid #e1e3e6;
}

.m-sidebtn__btn {
  display: block;
  box-sizing: border-box;
  width: 262px;
  position: relative;
  color: #231815 !important;
  font-size: 12px;
  line-height: 1.4;
  overflow: hidden;
}

.m-sidebtn__btn:hover, .m-sidebtn__btn:active, .m-sidebtn__btn:visited {
  color: #231815;
}

.m-sidebtn__btn::after {
  position: absolute;
  top: 31px;
  right: 11px;
}

.m-sidebtn__btn--setting {
  background-image: url(https://p.dmm.com/p/general/mvno/public/guesttop/ico_apnSetting.png);
  background-repeat: no-repeat;
  background-position: 10px 15px;
  letter-spacing: -0.1px;
  padding: 18px 0 15px 58px;
}

.m-sidebtn__btn--terminal {
  background-image: url(https://p.dmm.com/p/general/mvno/public/guesttop/ico_terminalList.png);
  background-repeat: no-repeat;
  background-position: 9px 15px;
  background-size: 42px auto;
  letter-spacing: -0.1px;
  padding: 18px 0 15px 58px;
}

.m-sidebtn__btn--toolapp {
  background-image: url(https://p.dmm.com/p/general/mvno/public/guesttop/ico_toolApp.png);
  background-repeat: no-repeat;
  background-position: 10px 15px;
  letter-spacing: -0.1px;
  padding: 18px 0 15px 58px;
}

.m-sidebtn__btn--talkapp {
  background-image: url(https://p.dmm.com/p/general/mvno/public/guesttop/ico_dmmtalk.png);
  background-repeat: no-repeat;
  background-position: 10px 15px;
  letter-spacing: -0.1px;
  padding: 18px 0 15px 58px;
}

.m-sidebtn__btn--talkapp::before {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -3px;
}

.m-sidebtn__btn--talkapp::after {
  position: absolute;
  right: 8px;
  top: 50%;
  margin-top: -5px;
}

.m-sideBanner__list {
  margin-bottom: 10px;
  position: relative;
}

.m-sideBanner__list::before {
  position: absolute;
  right: 10px;
  top: 15px;
}

.m-sideBanner__list::after {
  position: absolute;
  right: 8px;
  top: 15px;
}

/**
 * MIXINS
 * PC
 */
/* =====================================
beginner/index PC
===================================== */
/*------------------------------
端末一覧、端末末端共通IMG(PC SP共通)
 *------------------------------*/
/*------------------------------
端末末端/一覧 共通カラーリスト(PC SP共通)
---------------------------------*/
/**
 * MIXINS
 * PC
 */
/*------------------------------
contactContents
---------------------------------*/
.m-contact {
  width: 100%;
  background-color: #eef6ff;
  color: #231815;
}

.m-contact__wrapper {
  width: 1000px;
  margin: 0 auto;
  overflow: hidden;
  padding: 24px 0;
  background-color: #eef6ff;
  text-align: center;
}

.m-contactTtl {
  font-size: 18px;
  font-weight: bold;
  margin: 0 0 20px;
}

.m-contactList {
  font-size: 0;
}

.m-contactList__item {
  width: 360px;
  display: inline-block;
  margin-bottom: 24px;
}

.m-contactList__item:first-child {
  border-right: 1px solid #e1e3e6;
}

.m-contactList__item--tel {
  width: 800px;
  margin-bottom: 0;
}

.m-contactList__item__catch {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 16px;
}

.m-contactList__item__catch__date {
  font-weight: normal;
  padding-left: 16px;
}

.m-contactList__item__btn {
  width: 290px;
  line-height: 1;
  display: block;
  padding: 15px 0 15px 20px;
  font-size: 14px;
  font-weight: bold;
  position: relative;
  background-color: #427ad3;
}

.m-contactList__item__btn:link, .m-contactList__item__btn:hover, .m-contactList__item__btn:active, .m-contactList__item__btn:visited {
  color: #fff;
  margin: 0 auto;
}

.m-contactList__item__btn::before {
  position: absolute;
  content: '';
  height: 30px;
  width: 30px;
  display: block;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  top: 7px;
  left: 14px;
}

.m-contactList__item__btn::after {
  position: absolute;
  top: 18px;
  right: 11px;
  content: "";
  display: inline-block;
  border: 3px solid;
  border-color: #06279f;
  border-left-width: 0;
  border-top-width: 0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  height: 6px;
  width: 6px;
  box-sizing: content-box;
}

.m-contactList__item__btn--qa {
  letter-spacing: -1px;
}

.m-contactList__item__btn--qa::before {
  background-image: url(https://p.dmm.com/p/general/mvno/public/guesttop/ico_questionS.png);
  background-repeat: no-repeat;
  background-position: 11px 6px;
}

.m-contactList__item__btn--form::before {
  background-image: url(https://p.dmm.com/p/general/mvno/public/guesttop/ico_mailS.png);
  background-repeat: no-repeat;
  background-position: 6px 9px;
}

.m-contactTel {
  display: table;
  width: 610px;
  margin: 10px auto 20px;
}

.m-contactTel__ttl {
  font-size: 12px;
  background: #fff;
  border: 1px solid #06279f;
  color: #06279f;
  width: 96px;
  display: table-cell;
  vertical-align: middle;
  line-height: 1.2;
  font-weight: bold;
  padding: 4px 0;
}

.m-contactTel__number {
  font-family: 'Oswald', sans-serif;
  font-size: 28px;
  line-height: 1;
  letter-spacing: 1.8px;
  display: table-cell;
  vertical-align: middle;
  padding: 0 20px 0 10px;
}

.m-contactNotice {
  text-align: left;
  width: 610px;
  margin: 0 auto;
  font-size: 11px;
}

.m-contactNotice__item {
  position: relative;
  padding: 0 0 0 1em;
  line-height: 1.4;
}

.m-contactNotice__item__ico {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}

/*------------------------------
 * コンテンツ
 *------------------------------*/
.m-beginnerContents {
  width: 1000px;
  padding-top: 87px !important;
  margin-top: -87px !important;
  margin-left: auto;
  margin-right: auto;
}

.m-beginnerContents__ttl {
  box-sizing: border-box;
  color: #fff;
  border-bottom: 36px solid #06279f;
  border-right: 36px solid transparent;
  width: 274px;
  height: 0;
  text-align: left;
  font-size: 16px;
  font-weight: bold;
  line-height: 40px;
  display: inline-block;
  margin-top: 40px;
  padding-left: 20px;
}

.m-beginnerContents__ttl--notTitle {
  margin-top: 0px;
}

.m-beginnerContents__box {
  border-top: 4px solid #06279f;
  color: #231815;
  padding-top: 30px;
}

.m-itemTtl {
  box-sizing: border-box;
  width: 320px;
  height: 226px;
  display: block;
  padding-top: 170px;
}

.m-itemTtl--simfree {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_simfree.png);
  background-repeat: no-repeat;
}

.m-itemTtl--wichone {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_wichone.png);
}

.m-itemTtl--detacapa {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_detacapa.png);
}

.m-itemTtl--mnp {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_mnp.png);
}

.m-itemTtl--terminology {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_terminology.png);
}

.m-itemTtl--confirm {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_confirm.png);
}

.m-itemTtl--checkmobile {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_checkmobile.png);
}

.m-itemTtl--servicepoint {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_servicepoint.png);
}

.m-itemTtl--howtomobile {
  background-image: url(https://p.dmm.com/p/general/mvno/public/beginner/index/bg_howtomobile.png);
}

.m-itemTtl--movie::after {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 108px;
  height: 100px;
  background-image: url(https://p.dmm.com/p/general/mvno/public/common/ico_movie.png);
  background-size: 108px 100px;
  background-repeat: no-repeat;
  content: "";
}

.m-itemTtl__item {
  color: #000;
  font-size: 16px;
  font-weight: normal;
  background: #6d94cf;
  line-height: 56px;
  height: 56px;
  text-align: center;
  letter-spacing: 0.05em;
  display: inline-block;
  width: 100%;
  position: relative;
}

.m-itemTtl__item__txt {
  display: inline-block;
  line-height: 20px;
  vertical-align: middle;
}

.m-itemTtl__item--link::after {
  position: absolute;
  top: 22px;
  right: 11px;
  content: "";
  display: inline-block;
  border: 2px solid;
  border-color: #06279f;
  border-left-width: 0;
  border-top-width: 0;
  transform: rotate(-45deg);
  height: 10px;
  width: 10px;
  box-sizing: content-box;
}

.m-itemTtl__item--blank::before {
  content: "";
  position: absolute;
  border-bottom: 2px solid;
  border-left: 2px solid;
  border-color: #06279f !important;
  box-sizing: border-box;
  position: absolute;
  width: 17px;
  height: 12px;
  right: 14px;
  top: 50%;
  margin-top: -1px;
}

.m-itemTtl__item--blank::after {
  content: "";
  position: absolute;
  border-top: 4px solid;
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-left: 2px solid;
  border-color: #06279f !important;
  box-sizing: border-box;
  position: absolute;
  width: 19px;
  height: 15px;
  right: 9px;
  top: 50%;
  margin-top: -7px;
}

/*------------------------------
端末一覧、端末末端共通IMG(PC SP共通)
 *------------------------------*/
/*------------------------------
端末末端/一覧 共通カラーリスト(PC SP共通)
---------------------------------*/
/* =====================================
beginner/iphone PC
===================================== */
.l-pageWrapper__main--beginnerIphone {
  margin-top: 10px;
}

.m-iphoneContents {
  width: 100%;
  border-bottom: 1px solid #e1e3e6;
  padding-bottom: 30px;
}

.m-iphoneContents--simunlock {
  border: none;
}

.m-iphoneContents__ttl {
  margin-top: 35px;
  margin-bottom: 24px;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0.04em;
  display: block;
}

.m-iphoneContents__ttl__notes {
  font-size: 18px;
  margin-left: 20px;
}

.m-iphoneContentsBox {
  overflow: height;
}

#appliable,
#careerDetails,
#characteristics,
#flow,
#priceDown,
#simunlock {
  padding-top: 87px;
  margin-top: -87px;
}

/*------------------------------
characteristics
 *------------------------------*/
.m-iphoneCharacteristicsBox {
  overflow: hidden;
}

.m-iphoneCharacteristicsBox__left {
  width: 460px;
  float: left;
}

.m-iphoneCharacteristicsBox__left__read {
  font-size: 24px;
  text-align: center;
  line-height: 1.4;
}

.m-iphoneCharacteristicsBox__left__read--txtAccent {
  font-size: 34px;
  color: #06279f;
  font-weight: bold;
}

.m-iphoneCharacteristicsBox__left__read--newTerminal {
  width: 100%;
  padding: 22px 0;
  background: #ffcf52;
  border-radius: 10px;
  position: relative;
  line-height: 1;
}

.m-iphoneCharacteristicsBox__left__read--newTerminal__small {
  font-size: 16px;
}

.m-iphoneCharacteristicsBox__left__read--newTerminal::before {
  content: "";
  position: absolute;
  top: -22px;
  left: 50%;
  margin-left: -11px;
  border: 11px solid transparent;
  border-bottom: 11px solid #ffcf52;
}

.m-iphoneCharacteristicsBox__left__notes {
  font-size: 12px;
  color: #676767;
  text-align: center;
}

.m-iphoneCharacteristicsBox__right {
  float: right;
  width: 202px;
}

.m-iphoneCharacteristicsBoxList {
  overflow: hidden;
}

.m-iphoneCharacteristicsBoxList__item {
  margin-right: 30px;
  display: inline-block;
}

.m-iphoneCharacteristicsBoxList__item:last-child {
  margin-right: 0;
}

/*------------------------------
appliable/利用可能なiPhone 一覧
 *------------------------------*/
.m-iphoneAppliableBox__notes {
  color: #676767;
  font-size: 12px;
  text-align: left;
}

.m-iphoneAppliableBoxTable {
  width: 100%;
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

.m-iphoneAppliableBoxTable__ttl {
  margin: 0 auto;
  padding: 10px 0;
  font-size: 18px;
  text-align: center;
}

.m-iphoneAppliableBoxTable__ttl--softbank {
  color: #231815;
  background: #efb65e;
}

.m-iphoneAppliableBoxTable__ttl--docomo {
  color: #fff;
  background: #ea3f4a;
}

.m-iphoneAppliableBoxTable__subTtl {
  padding: 15px 0;
  font-size: 18px;
  text-align: center;
  background: #f3f3f3;
  border: 1px solid #e1e3e6;
}

.m-iphoneAppliableBoxTable__item {
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  border: 1px solid #e1e3e6;
}

.m-iphoneAppliableBoxTable__item--softbankAvailable {
  padding-top: 60px;
  background: url("https://p.dmm.com/p/general/mvno/public/beginner/iphone/icon-table-img01.png") no-repeat;
  background-position: center 90px;
}

.m-iphoneAppliableBoxTable__item--softbankUnavailable {
  padding-top: 60px;
  background: url("https://p.dmm.com/p/general/mvno/public/beginner/iphone/icon-table-img03.png") no-repeat;
  background-position: center 40px;
}

.m-iphoneAppliableBoxTable__item--docomo {
  padding-top: 120px;
  color: #ea3f4a;
  font-size: 22px;
  background: url("https://p.dmm.com/p/general/mvno/public/beginner/iphone/icon-table-img02.png") no-repeat;
  background-position: center 130px;
}

.m-iphoneAppliableBoxTable__item--iphoneX {
  color: #777;
}

/*------------------------------
priceDown/DMM mobileに変えるとどれくらい安くなるの？
*------------------------------*/
.m-iphonePriceDownBox__read {
  width: 80%;
  padding: 5px;
  margin: 0 auto;
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 1.4px;
  background: #f3f3f3;
  border-radius: 10px;
}

.m-iphonePriceDownBox__read__strong {
  color: #ea3f4a;
  font-size: 30px;
}

.m-iphonePriceDownBox__arrow {
  margin: 20px auto;
  text-align: center;
}

.m-iphonePriceDownBoxTable {
  width: 100%;
  border: none;
  border-collapse: collapse;
  border-spacing: 0;
}

.m-iphonePriceDownBoxTable__ttl {
  margin: 0 auto;
  padding: 10px 0;
  font-size: 18px;
  text-align: center;
  border: 1px solid #e1e3e6;
}

.m-iphonePriceDownBoxTable__ttl--dmmMobile {
  color: #231815;
  background: #427ad3;
  border-right: 3px solid #427ad3;
  border-left: 3px solid #427ad3;
  border-top: 1px solid #427ad3;
}

.m-iphonePriceDownBoxTable__ttl--docomo {
  color: #231815;
  background: #f3f3f3;
}

.m-iphonePriceDownBoxTable__subTtl {
  padding: 15px 10px;
  font-size: 18px;
  text-align: center;
  font-weight: normal;
  letter-spacing: -0.8px;
  background: #f3f3f3;
  border: 1px solid #e1e3e6;
}

.m-iphonePriceDownBoxTable__item {
  text-align: center;
  border: 1px solid #e1e3e6;
}

.m-iphonePriceDownBoxTable__item--dmmMobile {
  border-right: 3px solid #427ad3;
  border-left: 3px solid #427ad3;
}

.m-iphonePriceDownBoxTable__item--dmmMobileEnd {
  border-right: 3px solid #427ad3;
  border-left: 3px solid #427ad3;
  border-bottom: 3px solid #427ad3;
}

.m-iphonePriceDownBoxTable__item__txtPrice {
  font-family: 'Oswald', sans-serif;
  font-size: 26px;
  line-height: 0.6;
}

.m-iphonePriceDownBoxTable__item__txtPrice--red {
  color: #ea3f4a;
}

.m-iphonePriceDownBoxTable__item__txtPrice--strongRed {
  color: #ea3f4a;
  font-size: 30px;
}

.m-iphonePriceDownBoxTableTtlTxt {
  font-size: 16px;
}

.m-iphonePriceDownBoxTableTtlTxt__item {
  margin: 0 auto;
  padding: 2px 0;
  border-radius: 5px;
}

.m-iphonePriceDownBoxTableTtlTxt__item--dmmMobile {
  width: 90%;
  color: #fff;
  background: #06279f;
}

.m-iphonePriceDownBoxTableTtlTxt__item--docomo {
  width: 70%;
  background: #e2e2e2;
}

.m-iphonePriceDownBoxTableList {
  margin-bottom: 20px;
  display: -ms-inline-flexbox;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
  -webkit-align-items: center;
}

.m-iphonePriceDownBoxTableList__item {
  display: inline-block;
}

.m-iphonePriceDownBoxTableList__item__price {
  font-family: 'Oswald', sans-serif;
  font-size: 20px;
  line-height: 0.1;
  position: absolute;
  left: 27px;
  bottom: 5px;
}

.m-iphonePriceDownBoxTableList__itemBox {
  width: 105px;
  height: 90px;
  margin: 0 7px;
  padding: 10px 0;
  font-size: 12px;
  line-height: 1.4;
  display: inline-block;
  position: relative;
}

.m-iphonePriceDownBoxTableList__itemBox::after {
  font-family: FontAwesome;
  content: '\f067';
  width: 12px;
  height: 12px;
  color: #231815;
  margin: 30px 3px;
  font-size: 15px;
  position: absolute;
  top: 16px;
  right: -17px;
}

.m-iphonePriceDownBoxTableList__itemBox:last-child::after {
  content: '';
}

.m-iphonePriceDownBoxTableList__itemBox--dmmMobile {
  color: #fff;
  background: #06279f;
  border: 1px solid #06279f;
}

.m-iphonePriceDownBoxTableList__itemBox--docomo {
  color: #231815;
  background: #f3f3f3;
  border: 1px solid #e1e3e6;
}

.m-iphonePriceDownBoxTableList__itemBox--arrow {
  margin: 0 2px;
  color: #231815;
  font-size: 17px;
  font-weight: bold;
  background: none;
  vertical-align: inherit;
}

.m-freeCallText {
  margin-top: 5px;
}

/*------------------------------
flow/iPhoneをDMM mobileで使うには？
 *------------------------------*/
.m-iphoneFlowBox__ttl {
  color: #06279f;
  font-size: 18px;
}

.m-iphoneFlowBoxList {
  margin: 20px 0;
  overflow: hidden;
}

.m-iphoneFlowBoxList--docomo {
  padding-left: 50px;
}

.m-iphoneFlowBoxList--softbank {
  padding-left: 20px;
}

.m-iphoneFlowBoxList__item {
  float: left;
  position: relative;
}

.m-iphoneFlowBoxList__item__ico {
  width: 27px;
  height: 27px;
  margin-left: 10px;
  display: inline-block;
  background-color: #ffc71b;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  right: 10px;
  top: 6px;
}

.m-iphoneFlowBoxList__item__ico__txt {
  width: 30px;
  font-size: 11px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  display: inline-block;
  position: absolute;
  top: 7px;
  left: -1px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

.m-iphoneFlowBoxList__item--docomo {
  width: 150px;
  margin: 0 30px;
}

.m-iphoneFlowBoxList__item--docomo::after {
  font-family: FontAwesome;
  content: '\f0da';
  width: 12px;
  height: 12px;
  color: #06279f;
  margin: 30px 0;
  font-size: 30px;
  position: absolute;
  top: 20px;
  right: -42px;
}

.m-iphoneFlowBoxList__item--docomo:last-child::after {
  content: '';
}

.m-iphoneFlowBoxList__item--softbank {
  width: 150px;
  margin: 0 10px;
}

.m-iphoneFlowBoxList__item--softbank::after {
  font-family: FontAwesome;
  content: '\f0da';
  width: 12px;
  height: 12px;
  color: #06279f;
  margin: 30px 0;
  font-size: 30px;
  position: absolute;
  top: 20px;
  right: -21px;
}

.m-iphoneFlowBoxList__item--softbank:last-child::after {
  content: '';
}

.m-iphoneFlowBoxList__item__img {
  margin: 0 10px;
}

.m-iphoneFlowBoxList__item__ttl {
  font-size: 16px;
  font-weight: bold;
  line-height: 0.8;
  text-align: center;
}

.m-iphoneFlowBoxList__item__txt {
  font-size: 14px;
}

/*------------------------------
simunlock/SIMロックの解除方法
 *------------------------------*/
.iphoneSimunlockBoxList {
  overflow: hidden;
}

.iphoneSimunlockBoxList__item {
  width: 310px;
  margin: 0 20px;
  float: left;
}

.iphoneSimunlockBoxList__item__img {
  margin: 0 60px;
  text-align: center;
}

.iphoneSimunlockBoxList__item__ttl {
  font-size: 20px;
  text-align: center;
  font-weight: bold;
}

.iphoneSimunlockBoxList__item__txt {
  font-size: 14px;
}

/*------------------------------
careerDetails/詳しくは各キャリアの公式案内をご参照ください。
 *------------------------------*/
.m-iphoneCareerDetailsBox {
  padding: 30px 0;
  margin: 30px 0;
  overflow: hidden;
  border: 1px solid #e1e3e6;
}

.m-iphoneCareerDetailsBox__ttl {
  margin-bottom: 30px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}

.m-iphoneCareerDetailsBox__txt {
  margin: 0 23px;
}

.m-iphoneCareerDetailsBox__btn {
  width: 300px;
  margin: 0 23px;
  font-size: 18px;
  line-height: 1.0;
  display: block;
  float: left;
  background: #427ad3;
  position: relative;
}

.m-iphoneCareerDetailsBox__btn::after {
  content: '';
  width: 12px;
  height: 12px;
  background: url("https://p.dmm.com/p/general/mvno/public/beginner/iphone/icon-clone.png") no-repeat;
  position: absolute;
  top: 24px;
  right: 10px;
}

.m-iphoneCareerDetailsBox__btn__txt {
  color: #fff;
  text-align: center;
  letter-spacing: 1.2px;
}

.m-iphoneCareerDetailsBox--simfree__ttl {
  margin-bottom: 18px;
}

.m-iphoneCareerDetailsBox--simfree__txt {
  margin-bottom: 18px;
  text-align: center;
}

.m-iphoneCareerDetailsBox--simfree__btn {
  width: 646px;
  margin: 0 23px;
}

/*------------------------------
端末一覧、端末末端共通IMG(PC SP共通)
 *------------------------------*/
/*------------------------------
端末末端/一覧 共通カラーリスト(PC SP共通)
---------------------------------*/
/* =====================================
beginner/simfree PC
===================================== */
.m-simfreeContents p {
  margin: 0 !important;
}

/*------------------------------
 コンテンツ
 *------------------------------*/
.m-simfreeContents {
  padding-top: 87px !important;
  margin-top: -87px !important;
}

.m-simfreeContents__ttl {
  margin-top: 35px;
  margin-bottom: 30px;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0.04em;
}

.m-simfreeContents__ttl--top {
  margin-top: 0;
}

.m-simfreeContents__ttl--nofirst {
  margin-top: 60px;
}

.m-simfreeContents__ttl--ausoftbank {
  border-bottom: 2px solid #333;
  text-align: center;
  margin: 0 auto;
  width: 550px;
  font-size: 30px;
  margin-bottom: 20px;
  padding-top: 40px;
  letter-spacing: 0;
}

.m-simfreeContents__subtxt {
  text-align: center;
  width: 100%;
  font-size: 14px;
}

.m-simfreeContents__mobileUser {
  background-color: #f2f2f2;
  padding-bottom: 26px;
  margin-top: 30px;
}

.m-simCardDetail img {
  margin-left: 20px;
}

.m-simCardDetail__txt {
  font-size: 14px;
  line-height: 1.7;
  margin-top: 30px;
}

.m-simCardDetail__txt--space {
  padding: 20px 0;
}

.m-simCardDetail__br {
  padding-top: 20px;
}

.m-simLockFreeDetail__wrapper {
  overflow: hidden;
}

.m-simLockFreeDetail__left {
  float: left;
  width: 335px;
  margin-right: 30px;
}

.m-simLockFreeDetail__right {
  float: right;
  width: 335px;
  margin-right: 0;
}

.m-simLockFreeDetail__txt {
  font-size: 14px;
  line-height: 1.7;
  padding: 20px 0;
}

.m-simLockFreeDetail__ttl {
  background-color: #333;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  height: 37px;
  line-height: 37px;
  padding-left: 17px;
  margin-bottom: 20px;
}

.m-simLockFreeDetail__ttl--free {
  background-color: #e11c2e;
  color: #feec81;
}

.m-simLockFreeDetail__subDiscription {
  padding-right: 14px;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  vertical-align: middle;
  float: right;
}

.m-simLockFreeDetail__subDiscription--free {
  color: #feec81;
}

.m-simLockFreeDetail__caution {
  background-color: #e11c2e;
  color: #fff;
  padding: 20px;
  text-align: center;
}

.m-simLockFreeDetail__cautionTxt {
  line-height: 20px;
  display: inline-block;
  font-size: 16px;
}

.m-cautionMacUser__specWrap {
  border: 2px solid #427ad3;
  color: #427ad3;
  width: 615px;
  margin: 0 auto;
  margin-top: 30px;
  background-color: #fff;
  font-size: 14px;
  text-align: center;
  padding-bottom: 15px;
}

.m-cautionMacUser__ttl {
  font-size: 22px;
  font-weight: bold;
  padding: 20px 0;
}

.m-cautionMacUser__txt {
  padding-bottom: 5px;
  font-size: 14px;
}

.m-cautionMacUser__txt--type {
  font-size: 16px;
  font-weight: bold;
  padding: 20px 0;
}

.m-cautionMacUser__txt--notes {
  font-size: 16px;
  font-weight: bold;
  padding: 20px 0;
  color: #231815;
}

.m-contentsNoticeList {
  margin: 0 auto;
}

.m-contentsNoticeList__item {
  font-size: 12px;
  color: #676767;
  line-height: 1.4;
  position: relative;
  padding: 0 0 0 1em;
}

.m-contentsNoticeList__item__ico {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}

.m-contentsNoticeList__item__blank {
  position: relative;
  padding-right: 20px;
}

.m-contentsNoticeList__item__blank::before {
  content: "";
  position: absolute;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-color: #06279f !important;
  width: 10px;
  height: 7px;
  right: 3px;
  top: 4px;
  display: block;
  box-sizing: content-box;
}

.m-contentsNoticeList__item__blank::after {
  content: "";
  position: absolute;
  border-top: 2px solid;
  border-right: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-color: #06279f !important;
  width: 10px;
  height: 7px;
  right: 0;
  top: 0;
  display: block;
  box-sizing: content-box;
}

.m-contentsNoticeList__item a {
  margin-top: 5px;
}

.m-contentsNoticeList--another {
  text-align: left;
  margin-bottom: 15px;
  width: 615px;
}

.m-contentsNoticeList--blank {
  text-align: left;
  width: 615px;
}

.m-contentsNoticeList--left {
  margin-left: 0px;
  margin-top: 20px;
}

.m-detailButton {
  margin-top: 30px;
  text-align: center;
}

.m-detailButton--another {
  margin-top: 0;
  margin-bottom: 30px;
}

.m-detailButton__item {
  color: #fff;
  font-size: 16px;
  font-weight: normal;
  background: #427ad3;
  line-height: 56px;
  height: 56px;
  text-align: center;
  letter-spacing: 0.05em;
  display: inline-block;
  position: relative;
}

.m-detailButton__item__txt {
  display: inline-block;
  line-height: 56px;
  vertical-align: middle;
  font-weight: bold;
}

.m-detailButton__item--link {
  width: 300px;
}

.m-detailButton__item--link::after {
  position: absolute;
  top: 22px;
  right: 11px;
  content: "";
  display: inline-block;
  border: 3px solid;
  border-color: #06279f;
  border-left-width: 0;
  border-top-width: 0;
  transform: rotate(-45deg);
  height: 10px;
  width: 10px;
  box-sizing: content-box;
}

.m-detailButton__item--iphone {
  width: 400px;
}

.m-detailButton__item--iphone::after {
  position: absolute;
  top: 22px;
  right: 11px;
  content: "";
  display: inline-block;
  border: 3px solid;
  border-color: #06279f;
  border-left-width: 0;
  border-top-width: 0;
  transform: rotate(-45deg);
  height: 10px;
  width: 10px;
  box-sizing: content-box;
}

.m-detailButton__suportTxt {
  font-size: 16px;
  color: #333;
  padding: 20px 0 12px;
  font-weight: bold;
}

/* =====================================
beginner/possible PC
===================================== */
.m-beginnerCan {
  display: inline-block;
  box-sizing: border-box;
  margin: 0 20px 0 0;
  border: 2px solid #e70700;
  vertical-align: top;
  width: 340px;
  height: 345px;
  font-size: 18px;
}

.m-beginnerCan--not {
  border-color: #4c4c4c;
}

.m-beginnerCan__ttl {
  padding: 11px 0 13px;
  background-color: #e70700;
  text-align: center;
  color: #fff;
  font-size: 24px;
}

.m-beginnerCan__ttl--not {
  background-color: #4c4c4c;
}

.m-beginnerCan__list {
  padding: 15px 0 0 18px;
}

.m-beginnerCan__list--not {
  margin-bottom: 40px;
}

.m-beginnerCan__txt {
  margin: 11px 0 22px;
  text-align: center;
  font-weight: bold;
}

.m-beginnerCan__txt__emphasis {
  color: #e70700;
  font-size: 22px;
}

.m-beginnerCanList__item {
  position: relative;
  padding: 0 0 0 34px;
  height: 66px;
  font-size: 18px;
  font-weight: bold;
  line-height: 28px;
}

.m-beginnerCanList__item:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  border: 5px solid #f43d64;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  content: "";
}

.m-beginnerCanList__item--not:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  transform: rotate(45deg);
  margin: auto;
  border: none;
  border-radius: 0;
  width: 36px;
  height: 5px;
  background-color: #4c4c4c;
  content: "";
}

.m-beginnerCanList__item--not:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  transform: rotate(-45deg);
  margin: auto;
  border: none;
  border-radius: 0;
  width: 36px;
  height: 5px;
  background-color: #4c4c4c;
  content: "";
}

.m-beginnerCanListInner {
  display: table;
  width: 100%;
  height: 100%;
}

.m-beginnerCanListInner__img {
  display: table-cell;
  width: 83px;
  text-align: center;
  vertical-align: middle;
}

.m-beginnerCanListInner__img--not {
  width: 88px;
}

.m-beginnerCanListInner__txt {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
}

.m-beginnerCanNotes {
  position: relative;
  padding: 0 0 0 1.2em;
  margin: 0;
  font-size: 11px;
  font-weight: normal;
  line-height: 14px;
}

.m-beginnerCanNotes__ico {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}

.m-beginnerAnnotationIco {
  position: relative;
  top: -3px;
  vertical-align: top;
  font-size: 12px;
  font-weight: normal;
}

/* =====================================
beginner/datatraffic PC
===================================== */
.m-beginnerCriterion {
  width: 220px;
  background-color: #f0f0f0;
}

.m-beginnerCriterion__upper {
  padding: 15px 0 0 15px;
  height: 108px;
}

.m-beginnerCriterion__lower {
  height: 35px;
  background-color: #06279f;
}

.m-beginnerCriterionTtl {
  display: table;
  width: 100%;
  height: 51px;
}

.m-beginnerCriterionTtl__ico {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.m-beginnerCriterionTtl__txt {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 14px;
  font-weight: bold;
  line-height: 18px;
}

.m-beginnerCriterionTtl__txt--small {
  font-size: 13px;
  line-height: 16px;
}

.m-beginnerCriterionAmount {
  margin: 2px 0 0;
  padding-right: 15px;
  text-align: center;
  color: #06279f;
  font-size: 22px;
  font-weight: bold;
}

.m-beginnerCriterionAmount__number {
  font-size: 32px;
}

.m-beginnerCriterionDescription {
  position: relative;
  padding-left: 81px;
  height: 100%;
  color: #fff;
}

.m-beginnerCriterionDescription__ttl {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 17px;
  margin: auto;
  border: 1px solid #fff;
  width: 62px;
  height: 16px;
  text-align: center;
  font-size: 10px;
  line-height: 16px;
}

.m-beginnerCriterionDescription__data {
  text-align: center;
  font-size: 14px;
  line-height: 35px;
}

.m-beginnerCriterionDescription__data__number {
  font-size: 18px;
  font-weight: bold;
}

/*------------------------------
 * layout
 *------------------------------*/
.l-page__header--simfree {
  margin-bottom: 60px;
}

.l-page__contents--beginner {
  padding-bottom: 60px;
}

/*------------------------------
 * header element
 *------------------------------*/
.m-breadcrumb--beginner {
  padding: 22px 0 17px;
}

.m-ttl {
  display: block;
  color: #231815;
  font-size: 18px;
  line-height: 1.3;
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
}

.m-beginnerTxtDescription {
  padding-bottom: 20px;
  width: 700px;
  font-size: 14px;
  line-height: 22px;
  margin-top: 15px;
}

/*------------------------------
 * 右カラム
 *------------------------------*/
.m-sideBox {
  margin: 0 0 20px 0;
}

.m-sideBox:first-child {
  margin-top: 10px;
}

.m-sideBox__ttl {
  box-sizing: border-box;
  display: inline-block;
  border-bottom: 36px solid #06279f;
  border-right: 36px solid transparent;
  margin: 0;
  padding: 0 0 0 18px;
  height: 0;
  width: 190px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 40px;
}

.m-sideBox__contents {
  border-top: 4px solid #06279f;
}

.m-sideBoxList {
  border-top: 1px solid #e1e3e6;
}

.m-sideBoxList__item {
  box-sizing: border-box;
  border: 1px solid #e1e3e6;
  border-top: none;
  height: 69px;
  line-height: 69px;
}

.m-sideBtn {
  position: relative;
  display: block;
  padding-left: 24px;
}

.m-sideBtn--movie {
  padding-left: 65px;
  min-height: 24px;
  background: url(https://p.dmm.com/p/general/mvno/public/beginner/common/bg_movie.png) no-repeat 20px 50%;
}

.m-sideBtn__item {
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  width: 100%;
  height: auto;
  vertical-align: middle;
  color: #000 !important;
  font-size: 14px;
  font-weight: bold;
  line-height: 20px;
}

.m-sideBtn__item::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  margin: auto;
  box-sizing: content-box;
}

.m-sideBtn__item--blank::before {
  content: "";
  position: absolute;
  right: 12px;
  top: 0;
  bottom: -6px;
  margin: auto;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-color: #06279f !important;
  width: 10px;
  height: 7px;
  box-sizing: content-box;
}

.m-sideBtn__item--blank::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 9px;
  margin: auto;
  border-top: 2px solid;
  border-right: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-color: #06279f !important;
  width: 10px;
  height: 7px;
  box-sizing: content-box;
}

/*------------------------------
 * リストボックス
 *------------------------------*/
.m-buttonList {
  font-size: 0;
  margin-left: -20px;
}

.m-buttonList__item {
  display: inline-block;
  font-size: 12px;
  margin: 0 0 20px 20px;
  position: relative;
}

/*------------------------------
 * 申し込みボタン & バナー
 *------------------------------*/
.m-beginnerBtn {
  width: 700px;
}

.m-beginnerBtn__btn a {
  display: block;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  position: relative;
  line-height: 1.5;
  background-color: #ffcf52;
  color: #231815 !important;
  padding: 27px 0;
}

.m-beginnerBtn__btn a::before {
  content: '';
  height: 60px;
  width: 60px;
  display: block;
  border-radius: 50%;
  position: absolute;
  top: 15px;
  left: 120px;
  background-color: white;
  background-image: url(https://p.dmm.com/p/general/mvno/public/common/ico_file.png);
  background-repeat: no-repeat;
  background-position: center;
}

.m-beginnerBtn__btn a::after {
  content: "";
  display: inline-block;
  border: 4px solid;
  border-color: #ea3f4a;
  border-left-width: 0;
  border-top-width: 0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  height: 13px;
  width: 13px;
  position: absolute;
  top: 36px;
  right: 149px;
}

.m-beginnerBnr {
  width: 700px;
  margin: 30px auto 60px;
  display: flex;
}

.m-beginnerBnr__item {
  padding-right: 20px;
}

.m-beginnerSubContents {
  margin: 48px 0 0;
}

.m-beginnerSubContents:first-child {
  margin: 0;
}

.m-beginnerSubContents__ttl {
  margin: 0 0 24px;
  padding: 6px 0 0;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0.04em;
  line-height: 1.4;
}

.m-beginnerSubContents__box {
  margin-bottom: 20px;
}

.m-beginnerSubContents__box--can {
  margin: 0 -20px 0 0;
  font-size: 0;
}

.m-beginnerSubContents__box--criterion {
  margin-bottom: 0;
}

.m-beginnerTable {
  width: 100%;
  border-collapse: collapse;
}

.m-beginnerTable__headerHead {
  padding: 8px 0;
  border-left: 1px solid #e1e3e6;
  width: 168px;
  background-color: #06279f;
  text-align: center;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
}

.m-beginnerTable__headerHead:first-child {
  border: none;
  width: auto;
}

.m-beginnerTable__headerHead:last-child {
  border-right: 1px solid #06279f;
  width: auto;
}

.m-beginnerTable__head {
  padding: 15px 0 15px 20px;
  border: 1px solid #e1e3e6;
  width: 340px;
  background-color: #f3f3f3;
  text-align: left;
  vertical-align: top;
  font-size: 18px;
  font-weight: normal;
}

.m-beginnerTable__head__small {
  font-size: 14px;
}

.m-beginnerTable__head__sub {
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  line-height: 16px;
}

.m-beginnerTable__head__sub__blank {
  padding-right: 18px;
  margin-right: 5px;
  position: relative;
}

.m-beginnerTable__head__sub__blank::before {
  content: "";
  position: absolute;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-color: #06279f !important;
  width: 10px;
  height: 7px;
  right: 3px;
  top: 4px;
  display: block;
}

.m-beginnerTable__head__sub__blank::after {
  content: "";
  position: absolute;
  border-top: 2px solid;
  border-right: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-color: #06279f !important;
  width: 10px;
  height: 7px;
  right: 0;
  top: 0;
  display: block;
}

.m-beginnerTable__data {
  border: 1px solid #e1e3e6;
  text-align: center;
  vertical-align: middle;
  font-size: 18px;
}

.m-beginnerAnnotation {
  color: #676767;
}

.m-beginnerAnnotation__item {
  position: relative;
  padding: 0 0 0 2em;
  font-size: 12px;
  line-height: 22px;
}

.m-beginnerAnnotation__item__ico {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}

.m-beginnerAnnotationSub {
  margin-left: -10px;
  font-size: 12px;
  line-height: 22px;
}

.m-beginnerAnnotationSub__item {
  position: relative;
  padding: 0 0 0 1em;
}

.m-beginnerAnnotationSub__item__ico {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}