@charset "utf-8";

body{
  font-family: "din-2014", 'Noto Sans JP', "Yu Gothic", Meiryo, sans-serif;
}

/*---------------------------------------------
   テキストリンク
---------------------------------------------*/
#cp a:hover, #cp a:active {
  opacity: .5;
  filter: alpha(opacity=50);
}
#cp .contentsLinkList p {
  margin-top: 0 !important;
  text-align: left !important;
}
#cp .linkColor {
  font-weight: bold !important;
  text-decoration: underline !important;
  color: #3f6974 !important;
}
/*---------------------------------------------
   共通
---------------------------------------------*/
#cp .fs13 {
  font-size: 13px !important;
}
#cp .txtB {
  font-weight: bold !important;
}
/*========================================================================================================================================= 【PC】 */

/*---------------------------------------------
  PC_口座開設ボタン
---------------------------------------------*/

#cp .kozaBtnArea {
  max-width: 970px;
  margin:0 auto 70px auto;
  padding-right: 25px;
  padding-left: 25px;
}
#cp .w640 {
  max-width: 640px;
  margin-right: auto;
  margin-left: auto;

}
#cp .kouzaBtnTit {
  font-weight: bold;
  margin-bottom: 12px;
  font-size: 18px;
  text-align:center;
}
#cp .kouzaBtnTit a {
  color:#ff0033;
  text-decoration:underline;
}
#cp .kouzaBtnTit a:hover {
  text-decoration:none;
}
#cp .kozaBtnArea .kouzaBtnType01 {
  font-size: 28px;
  font-weight: bold;
  line-height: 1.25;
  display: block;
  padding:20px 15px;
  text-align: center;
  text-decoration: none !important;
  letter-spacing: .15em;
  color: #fff !important;
  border: none;
  background: #f03;
}
#cp .kozaBtnArea .txtTime{
  display:block;
  font-size:14px;
  font-weight:normal;
  padding-bottom: 5px;
}
#cp .kozaBtnArea .txt{
  display:block;
}
#cp .kozaBtnArea .noticeList,
#cp .kozaBtnAreaClose .noticeList{
  margin-top: 10px;
}
#cp .kozaBtnArea .noticeList li,
#cp .kozaBtnAreaClose .noticeList li{
  font-size: 14px;
  margin-top: 0px;
  text-align:center;
  line-height:1.5;
}

/*---------------------------------------------
  PC_黒枠ボタン
---------------------------------------------*/
#cp .kouzaBtnType03 {
    width: 283px;
    font-weight: bold;
    line-height: 1.35;
    display: block;
    padding: 8px;
    text-align: center;
    text-decoration: none !important;
    letter-spacing: .0em;
    color: #404040 !important;
    border: 3px #404040 solid;
    margin: 0 auto;
}
#cp .kouzaBtnType03 .txtTime {
    font-size: 12px;
  font-weight:normal;
  margin-bottom: 2px;
}

/*---------------------------------------------
  PC_ビジュアルエリア
---------------------------------------------*/
#cp #visualArea{
  text-align:center;
}
#cp .kikan{
  text-align:center;
  padding:15px 0 35px;
  margin:0 auto;
  font-size:14px;
}

/*---------------------------------------------
  PC_コンテンツ
---------------------------------------------*/
#cp #contents {
  font-size:16px;
}

#cp .containerInnerFull{
max-width: 100%;
}

#cp .contentsText{
  text-align:left;
  margin-bottom:0;
}

#cp .contentsImgText{
  text-align:center;
  margin-bottom:0;
}
#cp .cp_02 {
  text-align: center;
  font-size: 38px;
  font-weight: bold;
  margin-bottom: 50px;
  line-height: 1.5;
}
#cp .cp_02::after {
content: '';
    background: #b5b4b4;
    width: 160px;
    height: 7px;
    display: block;
    margin: 20px auto 0 auto;
}

/*-- STEP-------------*/
#cp .stepBox {
  background:#ebeaea;
  padding:70px 0 40px 0;
  text-align:center;
}
#cp .stepBox .inner {
  margin: 0 auto;
  width:780px;
}
#cp .stepBox .stepBoxG {
  border:1px #666666 solid;
  padding:30px 20px;
}
#cp .stepBox .status {
  background: #ff0033;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    padding: 5px 12px;
    line-height: 1;
    margin-bottom: 7px;
    display: inline-block;
}
#cp .stepBox h3 {
  font-weight:bold;
  font-size:38px;
  line-height:1.4;
  margin-bottom:10px;
}
#cp .stepBox h4 {
  font-weight:bold;
  font-size:26px;
  line-height:1.4;
}
#cp .stepBox h5 {
  font-weight:bold;
  font-size:16px;
  line-height:1.4;
  margin-bottom: 12px;
}

#cp .stepBox .stepBoxW {
  padding:40px 20px 50px 20px;
  background:#fff;
  margin-bottom:10px;
}
#cp .stepBox strong {
  color: #FF0033;
  font-weight: bold;
}
#cp .stepBox .nagare {
  width: 551px;
  margin: 0 auto;
  text-align: left;
}
#cp .stepBox .nagare .examination {
  background: #ebeaea;
  font-size: 22px;
  padding: 8px;
  line-height: 1;
  text-align: center;
  margin: 15px 0;
  font-weight: bold;
}
#cp .stepBox .nagare > dl {
  display:table;
  width:100%;
  height:80px;
}
#cp .stepBox .nagare > dl > dt {
  display:table-cell;
  vertical-align:middle;
  width:30px;
}
#cp .stepBox .nagare > dl > dt > span {
  color:#fff;
  display:block;
  background:#525252;
  font-weight:bold;
  text-align:center;
  width:30px;
  height:30px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
}
#cp .stepBox .nagare > dl > dd {
  display: table-cell;
  vertical-align: middle;
  padding:0 100px 0 10px;
}
#cp .stepBox .nagare > dl > dd.step1 {
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_01.png) no-repeat right 50%;
}
#cp .stepBox .nagare > dl > dd.step2 {
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_02.png) no-repeat right 50%;
}
#cp .stepBox .nagare > dl > dd.step3 {
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_03.png) no-repeat right 50%;
}
#cp .stepBox .nagare > dl > dd.step4 {
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_04.png) no-repeat right 50%;
}
#cp .stepBox .nagare > .step1 {
  display: table-cell;
  height: 80px;
  vertical-align: middle;
  padding:0 10px 0 130px;
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_05.png) no-repeat left 50%;
  background-size: contain;
}
#cp .stepBox .nagare > .step2 {
  display: table-cell;
  height: 80px;
  padding:0 10px 0 130px;
  vertical-align: middle;
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_06.png) no-repeat left 50%;
  background-size: contain;
}

#cp .stepBox .stepArrow {
  text-align:center;
  margin:30px 0;
}
#cp .stepBox .example {
  border:2px dotted #ccc;
  text-align:left;
  padding:15px;
}
#cp .stepBox .exampleTxt {
  font-size:16px;
  line-height:1.8 !important;
  text-align:center;
}
#cp .stepBox .exampleG {
  background:#ebeaea;
  text-align:center;
}

#cp .stepBoxTxt {
  font-size:24px;
  font-weight:bold;
}
/*-- 金額　表-------------*/
#cp .stepBox table.cashbackTable{
  width:100%;
  }
#cp .stepBox table.cashbackTable th{
  background:#404040;
  color:#fff;
  text-align:center;
  font-size:26px;
  }
#cp .stepBox table.cashbackTable td{
  text-align:left;
  font-size:26px;
  }
#cp .stepBox table.cashbackTable th,.cashbackTable td{
  border:#666666 1px solid;
  padding:5px 15px;
  }
#cp .stepBox table .point {
  font-size: 16px;
    background: #ee898e;
    padding: 5px 8px;
    display: inline-block;
    margin-left: 10px;
    line-height: 1;
  vertical-align:middle;
  }
/*-- 達成　-------------*/
#cp .tasseiTxt {
  font-size: 20px;
    text-align: center;
    width: 700px;
    margin: 20px auto 40px auto;
  }
/*-- キャッシュバックスケジュール-------------*/
#cp .cashback h4 {
  font-weight: bold;
  font-size: 26px;
  line-height: 1.4;
  text-align: center;
}

/*---------------------------------------------
  PC_2カラム画像上テキスト下
---------------------------------------------*/
#cp .contentsCol2Wrap .col,
#cp .col2Wrap .col {
  float: left;
  box-sizing: border-box;
  width: 50%;
  padding-left: 1%;

  -o-box-sizing: border-box;
}
#cp .contentsCol2Wrap .col:first-child,
#cp .col2Wrap .col:first-child {
  padding-right: 1%;
  padding-left: 0;
}
#cp .contentsCol2Wrap {
    margin-bottom: 0px;
}
#cp .contentsCol2Wrap,
#cp .col2Wrap {
  overflow: hidden;
}
#cp .contentsCol2Wrap .img {
  margin-bottom: 10px;
}
#cp .contentsCol2Wrap.listType01 .col {
  margin-bottom: -30px;
}
#cp .contentsCol2Wrap.listType01 p {
  font-weight: bold;
  margin-bottom: 5px;
}
#cp .contentsCol2Wrap.listType01 .listTtl {
  font-weight: bold;
  margin-bottom: 5px;
}

/*---------------------------------------------
  PC_その他
---------------------------------------------*/
/*-- 注記-------------*/
#cp .attention {
  font-size:14px;
  text-align:left;
}
/*---------------------------------------------
  PC_キャンペーン詳細
---------------------------------------------*/
#info a {
    text-decoration: underline;
    font-weight: bold;
}
#cp .infoAreaList li:first-child {
  border-bottom:1px dotted #404040;
  padding-bottom:15px;
  padding-top:0;
}
#cp .infoAreaList li{
  border-bottom:1px dotted #404040;
  padding-bottom:15px;
  padding-top:15px;
}
#cp .infoAreaList li dt{
  padding-bottom:5px;

}
#cp .infoArea{
    max-width: 910px;
    margin: 0 auto;
    text-align: left;
}
  #cp .infoArea h2{
    text-align:center;
    font-size:28px;
    font-weight:bold;
    padding:0;
    margin:0;
}
#cp .infoArea .ttl{
  text-align:left;
  font-weight:bold;
  font-size:18px;
}
#cp .infoArea .txt{
  text-align:left;
}
#cp .infoArea .list li{
  border-bottom:none;
  padding-bottom:0;
  padding-top:0;
  padding-left: 1em;
  text-indent: -1em;
}
#cp .infoArea .detailList{
  margin-left:1em;

}
#cp .infoArea .detailList li{
  border-bottom:none;
  padding-bottom:0;
  padding-top:0;
}
#cp .infoArea .detailTtl{
  font-weight:bold;
}

#cp .contentsImgText p{
  font-size:3em;
}
/*============================================================================================== PC_終了対応 */
/*---------------------------------------------
  PC_キャンペーン トップエリア 終了対応
---------------------------------------------*/
#cp .cpEndInnerWrap {
  display: none;
  background: #ededed;
  padding: 23px 0;
}
#cp .cpEndInnerWrap .cpEndInner {
  padding-left: 30px;
  padding-right: 30px;
  max-width: 910px;
  margin: 0 auto;
}
#cp .cpEndInnerWrap .cpEndInner .box {
  text-align: center;
  border: 1px solid #ef0030;
}
#cp .cpEndInnerWrap .cpEndInner .box p {
  color: #ef0030;
  font-size: 19px;
  padding: 22px 20px 18px;
  text-align: center;
  line-height: 125%;
  font-weight: bold;
}

/*---------------------------------------------
  PC_口座開設ボタン 1カラム 終了対応
---------------------------------------------*/
#cp .kozaBtnAreaClose{
  display:none;
    max-width: 970px;
    margin:0 auto 70px auto;
    padding-right: 25px;
    padding-left: 25px;
}
#cp .kozaBtnAreaClose .Close {
    font-size: 26px;
    font-weight: bold;
    line-height: 1.25;
    display: block;
    padding:30px 15px;
    text-align: center;
    text-decoration: none !important;
    letter-spacing:0.06em;
    color: #fff !important;
    border: none;
    background: #808080;
  display:block;
}


/*================================================================================== PC_フォームメンテ注意表記 */
#cp #emergency {
  line-height: 0;
}
#cp #emergency .box {
  margin: 0px auto 0;
  text-align: center !important;
}
#cp #emergency .maxW {
  width: inherit;
  max-width: 100% !important;
  height: auto;
}

/*======================================================================================================== SP */

@media screen and (max-width: 767px) {

/*---------------------------------------------
  SP_口座開設ボタン
---------------------------------------------*/
#cp .kozaBtnArea {
    margin:0 auto 70px;
    padding:0 10px;
}
#cp .kozaBtnArea .kouzaBtnType01{
    font-size: 20px;
    font-weight: bold;
    line-height: 1.25;
    display: block;
    padding: 13px 10px;
    text-align: center;
    text-decoration: none !important;
    letter-spacing: .1em;
    color: #fff !important;
    border: none;
    background: #f03;
}

#cp .kouzaBtnTit {
    font-size: 14px;
}
#cp .kozaBtnArea .txtTime{
  display:block;
  font-size:12px;
}
#cp .kozaBtnArea .txt{
  display:block;
}
#cp .kozaBtnArea .noticeList,
#cp .kozaBtnAreaClose .noticeList{
  margin-top: 10px;

}
#cp .kozaBtnArea .noticeList li,
#cp .kozaBtnAreaClose .noticeList li{
  font-size: 10px;
  margin-top: 0px;
  text-align:center;
  line-height:1.375;
}
/*---------------------------------------------
  SP_コンテンツ内
---------------------------------------------*/
#cp .contentsImgText{
  margin-bottom:20px;
}

#cp .kozaBtnArea .noticeList{
  margin-top: 10px;

}
#cp .cp_02 {
  text-align: center;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 30px;
    line-height: 1.5;
  letter-spacing:-0.5px;
}
#cp .cp_02::after {
    content: '';
    background: #b5b4b4;
    width: 25%;
    height: 6px;
    display: block;
    margin: 15px auto 0 auto;
}


/*-- STEP-------------*/
#cp .stepBox .inner {
  width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
}
#cp .stepBox .stepBoxW {
  padding:25px 20px;
}
#cp .stepBox .nagare {
  width: 100%;
  background-size: inherit;
}

#cp .stepBox .nagare .examination {
    font-size: 20px;
}
#cp .stepBox .nagare > dl > dd {
    padding:0 70px 0 10px;
}
#cp .stepBox .nagare > dl > dt > span {
  height:27px;
  padding-top: 3px;
}
#cp .stepBox .nagare > dl > dd.step1 {
  background: url(/campaign/gaikaex/account/common_fx/images/sp/sp_img_nagare_01.png) no-repeat right 50%;
  background-size:65px 28px;
}
#cp .stepBox .nagare > dl > dd.step2 {
  background: url(/campaign/gaikaex/account/common_fx/images/sp/sp_img_nagare_02.png) no-repeat right 50%;
  background-size:46px 30px;
}
#cp .stepBox .nagare > dl > dd.step3 {
  background: url(/campaign/gaikaex/account/common_fx/images/sp/sp_img_nagare_03.png) no-repeat right 50%;
  background-size:49px 42px;
}
#cp .stepBox .nagare > dl > dd.step4 {
  background: url(/campaign/gaikaex/account/common_fx/images/sp/sp_img_nagare_04.png) no-repeat right 50%;
  background-size:47px 39px;
}
#cp .stepBox .stepArrow {
  width: 35%;
    margin: 30px auto;
}
#cp .stepBox h3 {
  font-size:26px;
}

#cp .stepBox h4 {
  font-size:20px;
}

#cp .stepBox .exampleTxt {
  font-size:13px;
}
#cp .stepBoxTxt {
  font-size:16px;
}

/*-- 金額　表-------------*/
#cp .stepBox table.cashbackTable th{
  font-size:14px;
  font-weight:bold;
  }
#cp .stepBox table.cashbackTable td{
  font-size:18px;
  }
#cp .stepBox table.cashbackTable th,.cashbackTable td{
  padding:5px;
  }
#cp .stepBox table .point {
  font-size: 12px;
  padding: 3px 5px;
  margin-left:8px;
  margin-bottom:2px;
  }
/*-- 達成　-------------*/
#cp .tasseiTxt {
  font-size: 20px;
    text-align: center;
    width: 90%;
    margin: 20px auto 40px auto;
  }
/*-- 注記-------------*/
#cp .attention li {
  font-size:16px;
  text-align:left;
}

/*---------------------------------------------
  SP_2カラム画像上テキスト下
---------------------------------------------*/
#cp .contentsCol2Wrap .col:nth-child(2n+1),
#cp .col2Wrap .col:nth-child(2n+1) {
    padding-right: 0;
  }
#cp .contentsCol2Wrap .col:nth-child(2n),
#cp .col2Wrap .col:nth-child(2n) {
    padding-left: 0;
  }
#cp .contentsCol2Wrap .col,
#cp .col2Wrap .col {
    width: 100%;
    margin-top: 30px;
  }
#cp .contentsCol2Wrap.listType01 {
    margin-bottom: 0;
  }
#cp .contentsCol2Wrap.listType01 .col {
    margin-bottom: -30px;
  }
#cp .contentsCol2Wrap.listType01 .p {
    margin-bottom: 5px;
  }
#cp .contentsCol2Wrap.listType01 .listGroup {
    margin-bottom: 30px;
  }
/*---------------------------------------------
  SP_キャンペーン詳細
---------------------------------------------*/
#cp .infoAreaList li:first-child {
  border-bottom:1px dotted #404040;
  padding-bottom:15px;
  padding-top:0;
}
#cp .infoAreaList li{
  border-bottom:1px dotted #404040;
  padding-bottom:15px;
  padding-top:15px;
}
#cp .infoAreaList li dd{
  font-size:12px;
}
#cp .infoArea{
    max-width: 890px;
    margin: 0 auto;
}
#cp .infoArea h2{
  text-align:center;
  font-size:22px;
  font-weight:bold;
  padding:0;
  margin:0;
}
#cp .infoArea .ttl{
  text-align:left;
  font-weight:bold;
  font-size:14px;
}
#cp .infoArea .txt{
  text-align:left;
}
#cp .infoArea .list li{
  border-bottom:none;
  padding-bottom:0;
  padding-top:0;
  padding-left: 1em;
  text-indent: -1em;
}
#cp .infoArea .detailList{
  margin-left:1em;

}
#cp .infoArea .detailList li{
  border-bottom:none;
  padding-bottom:0;
  padding-top:0;
}
#cp .infoArea .detailTtl{
  font-weight:bold;
}
/*============================================================================================== SP_終了対応 */

/*---------------------------------------------
  SP_キャンペーン トップエリア 終了対応
---------------------------------------------*/
#cp .cpEndInnerWrap {
  background: #ededed;
  padding: 3.8% 0;
}
#cp .cpEndInnerWrap .cpEndInner {
  padding-left: 15px;
  padding-right: 15px;
  margin: 0 auto;
}
#cp .cpEndInnerWrap .cpEndInner .box {
  text-align: center;
  border: 1px solid #ef0030;
}
#cp .cpEndInnerWrap .cpEndInner .box p {
  color: #ef0030;
  font-size: 12px;
  padding: 3.85% 4%;
  text-align: center;
  line-height: 135%;
  font-weight: bold;
}
#cp .cpEndInnerWrap .cpEndInner .box br {
  display: none;
}
/*---------------------------------------------
  SP_口座開設ボタン 1カラム 終了対応
---------------------------------------------*/
#cp .kozaBtnAreaClose {
    margin:0 auto 35px auto;
    padding:0 15px;
}
#cp .kozaBtnAreaClose .Close {
    font-size: 14px;
    font-weight: bold;
    line-height: 1.25;
    display: block;
    padding: 20px 5px;
    text-align: center;
    text-decoration: none !important;
    color: #fff !important;
    border: none;
    background: #808080;
}
/*---------------------------------------------
  SP_黒枠ボタン
---------------------------------------------*/
#cp .kouzaBtnType03 {
    width: 75%;
}


/*================================================================================== SP_フォームメンテ注意表記 */
#cp #emergency .box {
  margin: 0px 10px 0;
}
}



/*======================================================================================================== ipad */
@media screen and (min-width: 767px) and (max-width: 960px) {
#cp .kozaBtnAreaCol2Wrap .kouzaBtnType01 ,#cp .kozaBtnAreaCol2Wrap .kouzaBtnType02 {
  font-size: 22px;
}

#cp .kozaBtnAreaCol2Wrap .contentsCol2Wrap .col .txt {
  letter-spacing: 0;
}


/*-- STEP-------------*/
#cp .stepBox .inner {
  width: 95%;
    padding: 0 15px;
    box-sizing: border-box;
}
}

/* 2021.01.14 add ============================================================================================== */
#cp .ttlSup {
    font-size: 50%;
    position: relative;
    bottom: 25px;
}
@media screen and (max-width: 767px){
#cp .ttlSup {
    bottom: 12px;
}
#cp .stepBox .nagare > .step1 {
  display: table-cell;
  height: 80px;
  padding: 0px 10px 0 80px;
  vertical-align: middle;
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_05.png) no-repeat left 50%;
  background-size: 60px 57px;
}
#cp .stepBox .nagare > .step2 {
  display: table-cell;
  height: 80px;
  padding: 0px 10px 0 80px;
  vertical-align: middle;
  background: url(/campaign/gaikaex/account/common_fx/images/img_nagare_06.png) no-repeat left 50%;
  background-size: 60px 56px;
}
}

/* 2021.06.21 add ============================================================================================== */
/*-- 動画-------------*/
#cp .movie {
  text-align: center;
}
#cp #modal-content{
  width:80%;
  margin:0;
  padding:0;
  position:fixed;
  display:none ;
  z-index:99999;
}
@media screen and (min-width: 1150px){
#cp #modal-content{
  width:70%;
}
}

#cp #modal-content .inner{
  position:relative;
}

#cp #modal-content .inner{
  position:relative;
  width:100%;
  padding-top:56.25%;
  overflow:hidden;
}

#cp #modal-content .inner #player{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

#cp #modal-overlay{
  z-index:9999;
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:120%;
  cursor: pointer;
  background-color:rgba( 0,0,0, 0.75 );
}

#cp .modal-close {
  opacity: 1;
  position: absolute;
  top: -45px;
  right: 0px;
  width: 45px;
  height: 45px;
  padding: 0;
  pointer-events: none;
  border: 0;
}

/* 2021.07.31 add 大大大感謝祭CP ============================================================================================== */

#cp .big_cp {
    background: #ffcb40;
    text-align: center;
    padding:0;
}
#cp .big_cp .inner {
    margin: 0 auto;
    width: 910px;
}
#cp .big_cp .inner .present {

}
#cp .big_cp .inner .cp_btn {
    margin:40px 0;
}
#cp .big_cp .inner .cp_cashbackflow {
    background: #ebeaea;
    margin:0 0 40px 0;
    padding:40px 20px;
}
#cp .big_cp .inner .cp_campaignflow {
    margin:0 0 40px 0;
    padding:0 20px;
}
#cp .big_cp .inner .txtTime {
    font-size: 14px;
    text-align: left;
}
#cp .big_cp .inner .txtTime .style01 {
    font-weight: bold;
}
#cp .big_cp .inner .txtTime .style02 {
    text-decoration: underline;
}
#cp .big_cp .inner .txtTime .style03 {
    padding-left:10px;
}
#cp .big_cp .inner .txtLink {
    font-size: 20px;
}


/* SP Layout ======================= */
@media screen and (max-width: 767px){
#cp .big_cp .inner {
    width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
}
#cp .big_cp .inner .present,#cp .big_cp .inner .cp_btn,#cp .big_cp .inner .cp_campaignflow {
    padding: 0 15px;
}

#cp .big_cp .inner .cp_cashbackflow {
    padding:20px 15px;
}
}

/*---------------------------------------------
	SP_動画エリア
---------------------------------------------*/
@media screen and (max-width: 767px) {
  #cp .movieArea .movieLayout {
    position: relative;
      padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
      height: 0;
      overflow: hidden;
  }
  #cp .movieArea .movieLayout iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}

/* 2021.11.10 add ============================================================================================== */
#cp .movieArea {
  border-top: 1px #bfbfbf solid;
}

/* 2022.3.18 add ============================================================================================== */
.resizeHide {
  display: block !important; }
.resizeShow {
  display: none !important; }
  @media screen and (max-width: 800px) {
    .resizeHide {
      display: none !important; }
    .resizeShow {
      display: block !important; } }

/* 2023.7.1 ============================================================================================== */
@media screen and (max-width: 767px) {
  .pcOnly {
      display: block !important;
  }
  .spOnly {
    display: none !important;
}
}
@media screen and (max-width: 640px) {
  .pcOnly {
      display: none !important;
  }
  .spOnly {
    display: block !important;
}
}
.txtBlue {
  color: #005bac;
}
.bgBlue{
background: #eef3f5;
}
span.en {
  font-size: 125%;
  position: relative;
  top: 1px;
}
span.redNumber {
  color: #dc1c26;
}
#detailInner .indent{
  font-size: 14px;
}

/* mv ========== */
#mv {
  width: 100%;
  background: url(/lp/common_fx/images/img_mv_04.webp), linear-gradient(-290deg, #8ADBDE 30%, #65C6C9 100%);
  overflow: hidden;
  background-position: bottom;
  background-size: cover;
  background-repeat: no-repeat;
}
.mvWrap {
  max-width: 980px;
  width: 94%;
  margin: 0 auto;
  padding: 0 0;
  position: relative;
}
.mvText{
  max-width: 586px;
  width: 60%;
  margin-bottom: 0px;
}
.mvSwap {
  position: absolute;
  top: 25px;
  right: 0;
  max-width: 194px;
  width: 17%;
  z-index: 3;
}
.mvBtn{
  max-width: 560px;
  position: relative;
  z-index: 2;
  margin: 100px auto 0;
}
.mvBtn .btn{
  width: 100%;
}
.mvBtn .tips {
  background: #fff;
  border-radius: 100px;
  color: #1c1c1c;
  width: 260px;
  position: absolute;
  text-align: center;
  top: -25px;
  left: 0;
  right: 0;
  z-index: 100;
  margin: auto;
  box-shadow: 0px 3px 6px 0px #8a0a11;
  font-weight: bold;
  font-size: 17px;
  }
  .mvBtn .tips::before {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  width: 0;
  height: 0;
  margin: auto;
  border-style: solid;
  border-width: 16px 15px 0 15px;
  border-color: #ffffff transparent transparent transparent;
}
.mvHuman{
  max-width: 397px;
  width: 39.5%;
  position: absolute;
  top: 26px;
  right: 0;
  z-index: 1;
}
.mvSwap .note{
  line-height: 1.3em;
  font-size:8px;
  margin-top: 3px;
  padding: 0 13px;
}
/* btn */
.mvBtn .btn,
.modalBtn .btn {
  text-decoration: none;
  display: block;
  max-width: 650px;
  width: 90%;
  margin: 0 auto;
  padding: 20px 20px 19px;
  border-radius: 100px;
  box-shadow: 0 5px 0 0 #a80d15;
  background-color: #dc1c26;
  font-size: 40px;
  font-weight: 500;
  color: #fff;
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: center;
  transition: .3s all;
  position: relative;
  overflow: hidden;
}
.mvBtn .tips + .btn {
  padding: 32px 20px 19px;
}
.mvBtn .btn > span,
.modalBtn .btn > span {
  display: block;
  font-size: 18px;
  margin-bottom: 8px;
  position: relative;
}
.mvBtn .btn:hover,
.modalBtn .btn:hover {
  box-shadow: 0 0 0 0 #a80d15;
  transform: translate3d(0, 5px, 0);
}

@media screen and (max-width: 1100px) {
  /* .mvText {
    margin-bottom: 61px;
  } */
}

@media screen and (max-width: 800px) {
  .mvWrap {
    padding: 3vw 0;
  }
  .mvText {
    width: 60%;
    /* margin-bottom: 7.5vw; */
  }
  .mvSwap {
    width: 16%;
  }
  .mvBtn {
    width: 90%;
    margin: 11vw auto 0;
  }
  .mvBtn .tips {
    background: #fff;
    border-radius: 100px;
    color: #1c1c1c;
    width: 260px;
    position: absolute;
    text-align: center;
    top: -25px;
    left: 0;
    right: 0;
    z-index: 100;
    padding: 2px 0;
    margin: auto;
    box-shadow: 0px 3px 6px 0px #8a0a11;
    font-weight: bold;
    font-size: 17px;
    }
    .mvBtn .tips::before {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    margin: auto;
    border-style: solid;
    border-width: 16px 15px 0 15px;
    border-color: #ffffff transparent transparent transparent;
    }
  .mvHuman {
    width: 41%;
    right: 3%;
  }
  .mvSwap .note{
    font-size:1vw;
    padding:0 7px;
  }
}

@media screen and (max-width: 640px) {
  #mv {
    background: url(/lp/common_fx/images/img_mv_04.webp) 0 68.2%, linear-gradient(180deg, #8ADBDE 30%, #65C6C9 100%);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
  }
  .mvWrap {
    padding: 1vw 0 0 0;
    width: 100%;
  }
  .mvText {
    width: 100%;
    margin: -4vw auto 48.4vw;
    padding-right: 1vw;
  }
  .mvSwap {
    width: 43%;
    position: relative;
    top: 0;
    max-width: 356px;
  }
  .mvBtn {
    width: 94%;
    margin: 9.5vw auto 0;
  }
  .mvBtn .btn {
    padding: 7vw 0 4vw;
    animation: heartbeat 2.5s linear 2s infinite both;
  }
  @keyframes heartbeat {
    from {
      transform: scale(1);
      transform-origin: center center;
      animation-timing-function: ease-out;
    }
    10% {
      transform: scale(0.91);
      animation-timing-function: ease-in;
    }
    17% {
      transform: scale(0.98);
      animation-timing-function: ease-out;
    }
    33% {
      transform: scale(0.87);
      animation-timing-function: ease-in;
    }
    45% {
      transform: scale(1);
      animation-timing-function: ease-out;
    }
  }
  .mvBtn .tips {
    font-size: 15px;
    width: 210px;
  }
  .mvHuman {
    max-width: 550px;
    width: 52%;
    position: absolute;
    top: 69.5vw;
    right: 26vw;
    z-index: 1;
  }
  .mvSwap .note{
    font-size:1.7vw;
    text-align: center;
    padding:0;
  }

  /* btn */
  .mvBtn .btn,
  .modalBtn .btn {
    font-size: 6.4vw;
    width: 100%;
    padding: 3vw;
    box-shadow: 0 3px 0 0 #a80d15;
  }
  .mvBtn .btn:hover,
  .modalBtn .btn:hover {
    transform: translate3d(0, 3px, 0);
  }
  .mvBtn .btn > span,
  .modalBtn .btn > span {
    font-size: 4vw;
    margin-bottom: 2vw;
  }
}

/* common ========== */
.sectionContents{
  max-width: 980px;
  margin: 0 auto;
  width: 94%;
}
.sectionContents section {
  padding: 100px 0 0;
}
.sectionContents .en {
  font-weight: 600;
}
.modalTtl{
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  position: relative;
  padding-bottom: 24px;
  margin-bottom: 40px;
}
.modalTtl::after{
  content: "";
  width: 120px;
  height: 4px;
  background: #005bac;
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.ttlBtm {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.6em;
  text-align: center;
  margin-bottom: 64px;
}
.modalBtn {
  margin-top: 40px;
}

@media screen and (max-width: 800px) {
  .sectionContents section {
    padding: 5vw 0;
  }
  .modalTtl {
    font-size: 4.8vw;
    padding-bottom: 3vw;
    margin-bottom: 5vw;
  }
  .modalTtl::after {
    width: 15vw;
  }
  .ttlBtm {
    font-size: 3vw;
    margin-bottom: 8vw;
  }
  .modalBtn {
    margin-top: 5vw;
  }
}

@media screen and (max-width: 640px) {
  .sectionContents section {
    padding: 8vw 0;
  }
  .modalTtl {
    font-size: 7.46666vw;
    padding-bottom: 4.2666vw;
    margin-bottom: 6.4vw;
  }
  .modalTtl::after {
    width: 21.33334vw
  }
  .ttlBtm {
    font-size: 4.2666vw;
    margin-bottom: 10.6666vw;
  }
  .modalBtn {
    margin-top: 6.4vw;
  }
}


/* top =========== */
section.Top {
  text-align: center;
  max-width: 980px;
  margin: 0 auto;
}
.topTtl {
  font-size: 38px;
  font-weight: 700;
  line-height: 1.2em;
  position: relative;
  margin-bottom: 8px;
  text-align: center;
  display: inline-block;
}
.topTtl::before {
  content: "/";
  color: #005bac;
  font-size: 38px;
  display: inline-block;
  position: relative;
  top: 0;
  left: 0;
  transform: scaleX(-1);
}
.topTtl::after {
  content: "/";
  color: #005bac;
  font-size: 38px;
  display: inline-block;
  position: relative;
  top: 0;
  right: 0;
}
.topTtl .en {
  font-size: 115%;
}
.Top .note {
  margin-top: 16px;
  text-align: left;
}

@media screen and (max-width: 1000px) {
  .topTtl, .topTtl::before, .topTtl::after {
    font-size: 3.7962vw;
  }
}

@media screen and (max-width: 800px) {
  .topTtl, .topTtl::before, .topTtl::after {
    font-size: 4.5vw;
  }
  .Top .note {
    margin-top: 2vw;
  }
}

@media screen and (max-width: 640px) {
  .topTtl {
    font-size: 6.4vw;
    margin: 0 auto 3.2vw;
    padding: 0 7vw;
  }
  .topTtl::after {
    content: "";
    display: block;
    width: 5.33334vw;
    height: 100%;
    background: url(/lp/common_fx/images/modal/parts_modalttl_01.svg) no-repeat center center;
    background-size: contain;
    position: absolute;
  }
  .topTtl::before {
    content: "";
    display: block;
    width: 5.33334vw;
    height: 100%;
    background: url(/lp/common_fx/images/modal/parts_modalttl_01.svg) no-repeat center center;
    background-size: contain;
    position: absolute;
  }
  .Top .note {
    margin-top: 2.1333vw;
  }
}


/* flow ========== */
#Flow{
  max-width: 980px;
  margin: 0 auto;
}

.flowStep li {
  width: 100%;
  margin-bottom: 40px;
  position: relative;
  padding: 40px 5.556%;
}
.flowStep li::after {
  content: "";
  display: block;
  width: 28px;
  height: 28px;
  background: url(/lp/common_fx/images/icon_arrow_black.svg) no-repeat center center;
  background-size: contain;
  position: absolute;
  bottom: -14px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.flowStep li:last-child {
  margin-bottom: 0;
}
.flowStep .stepNum {
  font-size: 40px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: center;
  position: absolute;
  top: -20px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.flowStep .stepBlock {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.flowStep .stepImg {
  max-width: 160px;
  width: 25%;
}
.flowStep .stepTxt {
  width: 70%;
}
.flowStep .stepTxt > p {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.6em;
}
.flowStep .note {
  margin-top: 8px;
}

/* step02 stage */
.flowStep .stepStage {
  width: 100%;
  background: #fff;
  margin-top: 40px;
}
.stepStage thead {
  width: 100%;
  background: #4c4c4c;
  color: #fff;
}
.stepStage th {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  padding: 20px 6.25%;
  text-align: center;
}
.stepStage th:first-child {
  width: 53.2%;
  border-right: 1px solid #fff;
}
.stepStage th:last-child {
  width: 46.8%;
}
.stepStage th .txtS {
  font-size: 12px;
  padding-left: 0.5em;
  font-weight: 500;
}
.stepStage tbody tr {
  border-bottom: 1px solid #4c4c4c;
  font-size: 24px;
}
.stepStage tbody tr .en {
  font-size: 40px;
  font-weight: 500;
}


.stepStage td {
  padding: 12px 10.5%;
  font-weight: 500;
  line-height: 1;
  text-align: right;
}
.stepStage td:first-child {
  border-right: 1px solid #4c4c4c;
}
.stepStage td:last-child {
  font-weight: 700;
}
.stepStage td:last-child .en {
font-weight: 700;
}
/*
.stepStage .stage01 {
  font-size: 16px;
}
.stepStage .stage01 .en {
  font-size: 24px;
  padding-right: 2px;
  font-weight: 500;
}
.stepStage .stage02 {
  font-size: 20px;
}
.stepStage .stage02 .en {
  font-size: 30px;
  font-weight: 500;
}
.stepStage .stage03 {
  font-size: 24px;
}
.stepStage .stage03 .en {
  font-size: 40px;
  font-weight: 500;
}
.stepStage .stage04 {
  font-size: 28px;
}
.stepStage .stage04 td {
  font-weight: 700;
}
.stepStage .stage04 .en {
  font-size: 50px;
  font-weight: 700;
}
*/
.stepStage tbody tr:last-child {
  border: none;
}

/* step03 */
.flowStep .step03 .stepImg {
  max-width: 640px;
  width: 100%;
  margin: 0 auto;
}
.flowStep li.step03::after{
  content: none;
}

@media screen and (max-width: 1000px) {
  /*.
  .stepStage .stage01 {
    font-size: 1.6vw;
  }
  .stepStage .stage01 .en {
    font-size: 2.4vw;
  }
  .stepStage .stage02 {
    font-size: 2vw;
  }
  .stepStage .stage03 {
    font-size: 2.4vw;
  }
  .stepStage .stage02 .en {
    font-size: 3vw;
  }
  .stepStage .stage03 .en {
    font-size: 4vw;
  }
  */
  .stepStage td {
    padding: 12px 7vw;
  }
  /*
  .stepStage td {
    padding: 12px 7vw;
  }
  .stepStage .stage04 {
    font-size: 2.8vw;
  }
  .stepStage .stage04 .en {
    font-size: 5vw;
  }
  */
}

@media screen and (max-width: 800px) {
  .flowStep li {
    margin-bottom: 5vw;
    padding: 5vw;
  }
  .flowStep li::after {
    width: 3.5vw;
    height: 3.5vw;
    bottom: -1.75vw;
  }
  .flowStep .stepNum {
    font-size: 5vw;
    top: -2.5vw;
  }
  .flowStep .stepTxt > p {
    font-size: 3vw;
  }

  /* step02 stage */
  .flowStep .stepStage {
    margin-top: 5vw;
  }
  .stepStage th {
    font-size: 2.5vw;
    padding: 2.5vw 4vw;
  }
  .stepStage td {
    padding: 1.5vw 7vw;
  }
/*
  .stepStage .stage01 {
    font-size: 2vw;
  }
  .stepStage .stage01 .en {
    font-size: 3vw;
  }
  .stepStage .stage02 {
    font-size: 2.5vw;
  }
  .stepStage .stage02 .en {
    font-size: 3.75vw;
  }
  */
  .stepStage tbody tr {
    font-size: 3vw;
  }
  .stepStage tbody tr .en {
    font-size: 5vw;
  }
  /*
  .stepStage .stage04 {
    font-size: 3.4vw;
  }
  .stepStage .stage04 .en {
    font-size: 6vw;
  }
  */
}

@media screen and (max-width: 640px) {
  .flowStep li {
    margin-bottom: 10.6666vw;
    padding: 6.4vw 4.2666vw;
  }
  .flowStep li::after {
    width: 7.5vw;
    height: 7.5vw;
    bottom: -3.75vw;
  }
  .flowStep .stepNum {
    font-size: 8.5333vw;
    top: -4.2666vw;
  }
  .flowStep .stepBlock {
    flex-wrap: wrap;
  }
  .flowStep .stepImg {
    max-width: 400px;
    width: 45%;
    text-align: center;
    margin: 0 auto 2.1333vw;
  }
  .flowStep .stepTxt {
    width: 100%;
  }
  .flowStep .stepTxt > p {
    font-size: 4.2666vw;
    text-align: center;
  }
  .flowStep .note {
    margin-top: 2.1333vw;
  }

  /* step02 stage */
  .flowStep .stepStage {
    margin-top: 4.2666vw;
  }
  .stepStage th {
    text-align: center;
    font-size: 3.73333vw;
    padding: 3.2vw 2.1333vw 2.5vw;
    line-height: 1.2em;
  }
  .stepStage th .txtS {
    font-size: 2.93333vw;
    padding-left: 0;
    display: block;
    font-weight: 400;
  }
  .stepStage td {
    padding: 2.6666vw 4vw;
  }
  /*
  .stepStage .stage01 {
    font-size: 2.93333vw;
  }
  .stepStage .stage01 .en {
    font-size: 4.2666vw;
  }
  .stepStage .stage02 {
    font-size: 3.2vw;
  }
  .stepStage .stage02 .en {
    font-size: 4.8vw;
  }
  */
  .stepStage tbody tr {
    font-size: 4.26666vw;
  }
  .stepStage tbody tr .en {
    font-size: 5.86666vw;
  }
  /*
  .stepStage .stage04 {
    font-size: 3.73333vw;
  }
  .stepStage .stage04 .en {
    font-size: 6.93333vw;
  }
  */
  .flowStep li.step03 {
    padding-top: 2.1333vw;
  }
}

/* Schedule ========== */
#Schedule {
  max-width: 980px;
  margin: 0 auto;
}

#Schedule .scheduleTxt {
  font-size: 16px;
  line-height: 1.6em;
  margin-top: 16px;
}

@media screen and (max-width: 800px) {
  #Schedule .scheduleTxt {
    font-size: 2vw;
    margin-top: 2vw;
  }
}

@media screen and (max-width: 640px) {
  #Schedule .scheduleTxt {
    font-size: 3.73333vw;
    margin-top: 4.2666vw;
  }
}

/* detail ========== */
#Detail{
  padding-bottom: 0;
  max-width: 980px;
  margin: 0 auto;
}
.detailList > dl > dt {
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 8px;
}
.detailList > dl > dd {
  font-size: 16px;
  line-height: 1.6em;
  padding-bottom: 16px;
  border-bottom: 1px solid #b5b7b8;
  margin-bottom: 16px;
}
.detailList > dl > dd .txtS {
  font-size: 14px;
}
.detailList > dl:last-child > dd {
  border-bottom: none;
}

@media screen and (max-width: 800px) {
  .detailList > dl > dt {
    font-size: 2vw;
    margin-bottom: 1vw;
  }
  .detailList > dl > dd {
    font-size: 1.75vw;
    padding-bottom: 2vw;
    margin-bottom: 2vw;
  }
  .detailList > dl > dd .txtS {
    font-size: 1.5vw;
  }
}

@media screen and (max-width: 640px) {
  .detailList > dl > dt {
    font-size: 4vw;
    margin-bottom: 2.1333vw;
  }
  .detailList > dl > dd {
    font-size: 3.46666vw;
    padding-bottom: 4.2666vw;
    margin-bottom: 4.2666vw;
  }
  .detailList > dl > dd .txtS {
    font-size: 3.2vw;
  }
}