@charset "Shift_JIS";

/**************************************************************/



/* ==========================================================================
  Block 説明　上下3行間
========================================================================== */





/* Element　説明　上下2行間
----------------------------------------------------------------- */



/*
  Modifier　説明　上下1行間
*/


/*セレクタ内　単一行コメント*/

/*スタイル属性はアルファベット順（同アルファベット同士の場合は厳密な並びは求めない）。但し、potition:top など、連続指定が当然の属性はこれを無視して良い*/

/**************************************************************/



/* ==========================================================================
  Base Setting
========================================================================== */



html { font-size: 62.5%; }

body{
  color: #333333;
  line-height: 1.8;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  font-size : 62.5%;
  font-weight: 400;
}

a{
  color: #333333;
  text-decoration: none;
}

*{
  box-sizing: border-box;
}

button{
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}

img{
  max-width: 100%;
  vertical-align: top;
}

.fntBold{
  font-weight: 600;
}

.img-spNone{
  display: initial;
}

.img-pcNone{
  display: none;
}


/* ==========================================================================
  mainHeader 共通ヘッダ
========================================================================== */



.allWrap_inner{
  font-size: 1.4rem;
  margin: 0 auto;
  overflow: hidden;
}



/* ==========================================================================
  mainHeader 共通ヘッダ
========================================================================== */



.mainHeader{
  display: block;
  margin: 0 auto;
  position: relative;
  width: 100%x;
}


/* mainHeader_topNav　説明　上下2行間
----------------------------------------------------------------- */


.mainHeader_topNav{
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  margin: 0 auto;
  padding: 14px 10px 12px 10px;
  width: 1080px;
}



/* ==========================================================================
  customerMenu 共通ヘッダ非レイヤーメニュー
========================================================================== */



.customerMenu{
  background-color: #ffffff;
  display: flex;
  align-items: center;
  margin-left: auto;
}


/*
  customerMenu-**
*/


.customerMenu-misc{
  font-size: 1.2rem;
}


.customerMenu-customer{
  margin-left: 32px;
}


.customerMenu-topNaviMain{
  margin-left: 0px;
}


/* customerMenu_item
----------------------------------------------------------------- */


.customerMenu_item{
  display: flex;
  align-items: center;
  height: 100%;
  font-size: 1.2rem;
}

/*
  customerMenu_item-**
*/

.customerMenu_item-rsv{
  margin-left:24px; 
}

.customerMenu_item-search{
  padding: 0 0 0 24px;
}

.customerMenu_item .customerMenu_link{
  color: #333333;
  display: flex;
  align-items: center;
  text-decoration: none;
}

.customerMenu_item:not(.customerMenu_item-login):not(.customerMenu_item-rsv):not(.customerMenu_item-search):not(.customerMenu_item-myPage) .customerMenu_link:hover{
  text-decoration: underline;
}

.customerMenu-misc .customerMenu_item .customerMenu_link{
  padding: 0 15px;
}

.customerMenu-misc .customerMenu_item:first-child .customerMenu_link{
  padding-left: 0px;
}

.customerMenu-customer .customerMenu_item .customerMenu_link{
  padding: 11px 22px 11px 0;
  position: relative;
}

.customerMenu_item.customerMenu_item-corporation .customerMenu_link,
.customerMenu_item.customerMenu_item-customer .customerMenu_link{
  padding-left: 33px;
}

.customerMenu_item-corporation .customerMenu_link::before,
.customerMenu_item-customer .customerMenu_link::before{
  background-image: url(../img/mainHeader_icon_01.png);
  height: 35px;
  margin-top: -17.5px;
  width: 27px;
}

.customerMenu_item.customerMenu_item-carshare .customerMenu_link{
  padding-left: 41px;
}

.customerMenu_item-carshare .customerMenu_link::before{
  background-image: url(../img/mainHeader_icon_02.png);
  height: 36px;
  margin-top: -18px;
  width: 30px;
}

.customerMenu-customer .customerMenu_item .customerMenu_link::before{
  background-position: 0 center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
}

.customerMenu-topNaviMain .customerMenu_link{
  font-size: 1.6rem;
  justify-content: center;
  min-width: 120px;
  padding: 7px 0 5px 0;
  text-align: center;
}

.customerMenu-topNaviMain .customerMenu_link:hover{
  opacity: 0.7;
}

.customerMenu_item-login .customerMenu_link,.customerMenu_item-myPage .customerMenu_link{
  color: #333333;
  background-color: #fcd22b;
  font-weight: 600;
}

.customerMenu_item-rsv .customerMenu_link{
  color: #ffffff;
  background-color: #ed0000;
  font-weight: 600;
}

.customerMenu_item-search .customerMenu_link{
  width: 27px;
  min-width: 27px;
}

.customerMenu_item-search .customerMenu_link.customerMenu_link-searchSPLayout{
  display: none;
}

.mainMenu_actionBtn{
  display: none;

}

.customerMenu-topNaviMain .customerMenu_link > span{
  display: inline-block;
}

.btn_box span{
  /*padding-right: 22px;*/
  position: relative;
}

.btn_box span::after{
  background-image: url(../img/images/mainHeader_arrow_01.png);
  background-position: 0 center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  content: '';
  display: none;
  height: 8px;
  position: absolute;
  top: 0.2em;
  right: 0;
  width: 8px;
}



/* 言語選択 */
#type_lang_area {
  /*
  left: 550px;
  position: absolute;
  top: 7px;
  */
  position: relative;
}
#type_lang {
  display: block;
}


#select_lang {
  position: absolute;
  z-index: 100;
  left:0;
  top:0;
}
#select_lang.hide_lang {
  display: none;
}
#select_lang li {
  height: 24px;
  width:94px;
  display: block;
  overflow: hidden;
  background: #1b385b;
  border-top:1px solid #ffffff;
}
#select_lang a {
  height: 24px;
  width:94px;
  display: block;
  overflow: hidden;
  background: #1b385b;
  color: #ffffff;

}

/*
  corporation customer
*/


.body-typePersonal .customerMenu_item-corporation{
  display: none;
}

.body-typeCorporation .customerMenu_item-customer,
.body-typeCorporation .customerMenu_item-login{
  display: none;
}
.body-typeUnderlayer .customerMenu_item-corporation,
.body-typeUnderlayer .customerMenu_item-login{
  display: none;
}



/* ==========================================================================
  mainHeader_mainMenu ヘッダグローバルメニュー
========================================================================== */



.mainHeader_mainMenu{
  background-color: #f7f7f0;
  width: 100%;
}

.mainMenu_headerBtn,
.mainMenu_bottomMenu{
  display: none;
}

.mainMenu{
  display: flex;
  margin: 0 auto;
  position: relative;
  width: 1080px;
}

.mainMenu_item{
  flex-grow: 1;
  min-height: 69px;
}

.mainMenu .mainMenu_link{
  background-color: #f7f7f0;
  color: #333333;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  /*padding: 0 48px;*/
  padding: 0 15px;
  position: relative;
  height: 100%;
  text-decoration: none;
  width: 100%;
}

.mainMenu .mainMenu_link.inMenu{
  /*pointer-events: none;*/
}

.mainMenu .mainMenu-active .mainMenu_link::before,
.mainMenu .mainMenu-crPosActive .mainMenu_link::before{
  background-color: transparent;
  border-top: 2px solid #ed0505;
  border-right: 2px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  bottom: 8px;
  left: calc(50% - 3px);
  transform: rotate(135deg);
  width: 6px;
}

.mainMenu .mainMenu_link::after{
  background-color: #cccccc;
  content: '';
  display: block;
  height: 3rem;
  position: absolute;
  top: calc(50% - 1.5rem);
  right: 0;
  width: 1px;
}

.mainMenu .mainMenu_item:last-child .mainMenu_link::after{
  display: none;
}

.mainMenu .mainMenu-active .mainMenu_link,
.mainMenu .mainMenu_link:hover{
  background-color: #ffffff;
}

/*
 mainMenu-crPosActive　current position
*/

.mainMenu .mainMenu-crPosActive .mainMenu_link{
  border-bottom: 2px solid #ed0505;
  color: #ed0000;
}



/* ==========================================================================
  ulMenu Underlayerメニュー
========================================================================== */



.ulMenu{
  display: none;
  position: absolute;
  top:inherit;
  left: 0px;
  width: 100%;
  z-index: 101;
}

.oAndCWrap .ulMenu.typeOaC_panel{
  display: none;
  overflow: hidden;
}


.mainMenu-active .ulMenu,
.mainMenu-active.oAndCWrap .ulMenu.typeOaC_panel{
  box-shadow: 0px 20px 20px -20px rgba(0,0,0,0.2);
  display: block;
}

.ulMenu > ul{
  background-color: #ffffff;
  display: flex;
  flex-wrap: wrap;
  padding: 20px 40px 34px 40px;
  width: 100%;
}

.ulMenu .ulMenu_item{
  display: flex;
  margin-right: 60px;
  padding: 15px 0 15px 0;
  width: calc(25% - 45px);
}

.ulMenu .ulMenu_item:nth-child(4n){
  margin-right: 0px;
}

.ulMenu_item.ulMenu_item-typeSPOnly{
  display: none;
}

.ulMenu .ulMenu_item .ulMenu_link{
  color:#333333;
  display: flex;
  font-size: 1.4rem;
  padding: 0 14px 0 0;
  position: relative;
  text-align: left;
  width: 100%;
}

.ulMenu .ulMenu_item .ulMenu_link:hover{
  text-decoration: underline;
}

.ulMenu .ulMenu_item .ulMenu_link::after{
  border-top: 2px solid #ed0505;
  border-right: 2px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: 0.5em;
  right: 0px;
  transform: rotate(45deg);
  width: 6px;
}



/* ==========================================================================
  sectionBlock
========================================================================== */



.sectionBlock_inner{
  margin-left: auto;
  margin-right: auto;
  width: 1080px;
}



/* ==========================================================================
  headingBlock
========================================================================== */



.headingBlock-styleTypeSingleTop{
  margin: 0 auto 40px auto;
  width: 1080px;
}

.headingBlock-styleType01{
  color: #333333;
  font-size: 2.2rem;
  font-weight: 600;
  margin-bottom: 15px;
  padding: 0 0 0 25px;
  position: relative;
}

.headingBlock-styleType01::before {
  background-color: #ed0505;
  content: '';
  display: block;
  height: 80%;
  position: absolute;
  top: 10%;
  left: 0;
  width: 6px;
}

.headingBlock-styleType03{
  color: #333333;
  font-size: 2.4rem;
  font-weight: 600;
  margin-bottom: 24px;
  position: relative;
  text-align: center;
}





/* ==========================================================================
  container
========================================================================== */



.container{
  margin: 0 auto;
  width: 100%;
}



/* ==========================================================================
  mainFooter　フッタ
========================================================================== */


.mainFooter{
  background-color: #fafafa;
  width: 100%;
}

.mainFooter_logoBelt{
  background-color: #ed0000;
  padding: 12px;
}

.mainFooter_logoBelt > p{
  margin-left: auto;
  margin-right: auto;
  width: 1080px;
}

.mainFooter_linkItemSet{
  display: flex;
  padding: 34px 0px 34px 0px;
  margin-left: auto;
  margin-right: auto;
  width: 1080px;
}


/* mainFooter_bnrItemSet　フッタ内バナー
----------------------------------------------------------------- */


.mainFooter_bnrItemSet{
  padding-bottom: 38px;
  margin-left: auto;
  margin-right: auto;
  width: 1080px;
}

.mainFooter_bnrItemSet > ul{
  display: flex;
}

.mainFooter_bnrItemSet li{
  width: 246px;
  margin-left: 32px;
}

.mainFooter_bnrItemSet li:first-child{
  margin-left: 0px;
}

.mainFooter_bnrItemSet a:hover img{
  opacity: 0.7;
}

/* header_MenuModal_itemSet_row　モーダル内リンク　列配置
----------------------------------------------------------------- */


.mainFooter_linkItemSet_row{
  margin-left: 32px;
}

.mainFooter_linkItemSet_row:first-child{
  margin-left: 0px;
}

.mainFooter_linkItem{
  margin-bottom: 28px;
  padding-right: 12px;
  width: 246px;
}

.mainFooter_linkItem:last-child{
  margin-bottom: 0px;
}


/* header_MenuModal_itemSet_row　モーダル内リンク　カテゴリ
----------------------------------------------------------------- */



.mainFooter_linkItem_header{
  padding-bottom: 11px;
}

.mainFooter_linkItem_header a{
  color: #808080;
  font-size: 1.4rem;
  font-weight: 600;
  position: relative;
  padding: 0 18px 0 0;
}

.mainFooter_linkItem_header a::after{
  border-top: 1px solid #b7b7b7;
  border-right: 1px solid #b7b7b7;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 0px;
  transform: rotate(45deg);
  width: 6px;;
}

.mainFooter_linkItem_header a:not([href*="javascript:void"]):not([href=""]):not([href="#"]):hover{
  text-decoration: underline;
}


/* header_MenuModal_itemSet_row　モーダル内リンク　個々のリンク
----------------------------------------------------------------- */

.mainFooter_linkItem > ul{
  border-top: 1px solid #e6e6e6;
  padding-top: 14px;
}

.mainFooter_linkItem ul:not(.sns) li{
  margin-bottom: 5px;
}

.mainFooter_linkItem li:last-child{
  margin-bottom: 0px;
}

.mainFooter_linkItem li a,
.mainFooter_linkItem li button{
  color: #808080;
  line-height: 2;
  position: relative;
  padding: 0 18px 0 0;
  font-size: 1.2rem;
}

.mainFooter_linkItem li a:hover,
.mainFooter_linkItem li button:hover{
  text-decoration: underline;
}

.mainFooter_linkItem li a::after,
.mainFooter_linkItem li button::after{
  border-top: 1px solid #b7b7b7;
  border-right: 1px solid #b7b7b7;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 0px;
  transform: rotate(45deg);
  width: 6px;;
}

.mainFooter_linkItem > ul ul{
  margin-top: 5px;
  padding-left: 1em;
}



/* ==========================================================================
  footerGLBNav　フッタ下部リンク
========================================================================== */



.footerGLBNav{
  background-color: #ffffff;
  padding: 40px 0 35px 0;
  width: 100%;
}

.footerGLBNav > nav{
  margin-right: auto;
  margin-left: auto;
  width: 1080px;
}

.footerGLBNav ul{
  display: flex;
  justify-content: center;
}

.footerGLBNav li{
  border-right: 1px solid #e6e6e6;
  font-size: 1.0rem;
  /* padding: 1px 19px; */
}

.footerGLBNav li:last-child{
  border-right: none;
}

.footerGLBNav a{
  color: #808080;
  font-size: 1.0rem;
  padding: 0 20px;
}

.footerGLBNav a:hover{
  text-decoration: underline;
}



/* ==========================================================================
  infoPrize
========================================================================== */

.infoPrize{
  background-color: #ffffff;
  border-bottom: 1px solid #e5e5e5;
  display: flex;
  flex-wrap: wrap;
  flex-direction: inherit;
  padding: 5rem;
  width: 1080px;
  margin: auto;
  justify-content: center;
}

.infoPrize_inner{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: 435px;
  padding: 0.5rem 0;
  border: 1px solid #e6e6e6 !important;
  margin: 20px 10px 10px 20px;
}

.infoPrize img{
  height: 60px;
  /*margin-bottom: 15px;*/
  width: 60px;
  padding-top: 5px;
}

.infoPrize p{
  color: #808080;
  font-size: 1.0rem;
  /*text-align: center;*/
  padding-left: 15px;
}

@media screen and (max-width: 640px){
  .infoPrize_text {
    display: none;
  }
}

/* ==========================================================================
  copyright
========================================================================== */



.copyright{
  background-color: #ffffff;
  padding: 5px 40px 40px 40px;
  width: 100%;
}

.infoPrize + .copyright{
  padding-top: 39px;
}

.copyright p{
  color: #808080;
  font-size: 1.0rem;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  width: 1080px;
}



/* ==========================================================================
  footerBtnSection
========================================================================== */



.footerBtnSection{
  display: flex;
  align-items: center;
  justify-content: stretch;
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
}



/* ==========================================================================
  returnTop
========================================================================== */



.returnTop{
  background-color: #ffffff;
  border: 1px solid #ed0000;
  border-radius: 50%;
  display: block;
  font-size: 0;
  height: 50px;
  position: fixed;
  right: 47px;
  bottom: 50px;
  width: 50px;
  z-index: 109;
}

.returnTop button{
  display: block;
  font-size: 0;
  height: 50px;
  width: 50px;
}

.returnTop button::before {
  border-top: 2px solid #ed0505;
  border-right: 2px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 3px);
  right: calc(50% - 5px);
  transform: rotate(-45deg);
  width: 6px;
}



/* ==========================================================================
  columnComp　カラム構成
========================================================================== */



.columnComp{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

/*
  columnComp-type01　2カラム50%構成　
*/

.columnComp-type01 .columnComp_box{
  width: 50%;
}

/*
  columnComp-type02　4カラム25%構成　
*/

.columnComp-type02 .columnComp_box{
  width: 25%;
}

/*
  columnComp-type03　3カラム33.3333333%構成　
*/

.columnComp-type03 .columnComp_box{
  width: 33.3333333%;
}



/* ==========================================================================
  arrowLink　>リンク　※各特定セクション内の>リンクには利用しない
========================================================================== */



a.arrowLink{
  color: #333333;
  display: inline-block;
  padding-right: 16px;
  position: relative;
}

a.arrowLink::after {
  border-top: 1px solid #ed0505;
  border-right: 1px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 2px;
  transform: rotate(45deg);
  width: 6px;
}

a.arrowLink:hover{
  text-decoration: underline;
}


a.arrowLink_status{
  color: #333333;
  display: inline-block;
  padding-right: 16px;
  position: relative;
}

a.arrowLink_status::after {
  border-top: 1px solid #808080;
  border-right: 1px solid #808080;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 4px);
  right: 2px;
  transform: rotate(45deg);
  width: 6px;
}

a.arrowLink_status:hover{
  text-decoration: underline;
}

/* ==========================================================================
  boxLink　枠有リンク
========================================================================== */



.boxLink{
  background-color: #ffffff;
  border: 1px solid #ed0505;
  display: inline-block;
  color: #ed0000;
  font-size: 1.4rem;
  font-weight: 600;
  padding: 12px 32px 11px 32px;
  position: relative;
  text-align: center;
}

.boxLink:hover{
  opacity: 0.7;
}

.boxLink small{
  font-size: 1.2rem;
  letter-spacing: 0.1em;
}

.boxLink.boxLink-type01:not([class*="linkBtnList-type"]):not(.boxLink-inImgText):hover{

  /*background-color: #ed0505;*/
  /*color: #ffffff;*/
}

.boxLink.boxLink-type01:not([class*="linkBtnList-type"]):not(.boxLink-inImgText):hover::before{
  /*border-color: #ffffff;*/
}

.boxLink.boxLink-inImgText:hover{
  opacity: 0.5;
}

.boxLink.boxLink-type02{
  background-color: #ed0505;
  border: 1px solid #ed0505;
  color: #ffffff;
}

.boxLink.boxLink-type02:hover{
  opacity: 0.7;
}

.boxLink-type02-inPopHeadline{
  overflow: visible;
}

.boxLink-type02-inPopHeadline .boxLink_popHeadline{
  color: #ed0000;
  font-size: 1.2rem;
  padding: 0 0.8em;
  position: absolute;
  top: -2em;
  left: 0px;
}

.boxLink-type02-inPopHeadline .boxLink_popHeadline::before,
.boxLink-type02-inPopHeadline .boxLink_popHeadline::after{
  background-color: #ed0000;
  content: '';
  display: block;
  height: 1.2em;
  position: absolute;
  top: 0.2em;
  right: -2px;
  transform: rotate(45deg);
  width: 1px;
}

.boxLink-type02-inPopHeadline .boxLink_popHeadline::after{
  right: auto;
  left: -2px;
  transform: rotate(-45deg);
}

.boxLink > span{
  display: inline-block;
}

.boxLink::before{
  border-top: 2px solid #ed0505;
  border-right: 2px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 13px;
  transform: rotate(45deg);
  width: 6px;
}

.boxLink.boxLink-type02::before{
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
}

.boxLink-typeCustom,
.boxLink-typeLogin,
.boxLink-typeMypage{
  border-color: #fcd22b;
  color: #333333;
  background-color: #fcd22b;
}

.boxLink.boxLink-typeMypage{
  font-size: 1.6rem;
  justify-content: center;
  min-width: 120px;
  padding: 7px 0 5px 0;
  text-align: center;
}


.boxLink-typeCustom:hover,
.boxLink-typeLogin:hover,
.boxLink-typeRsv:hover,
.boxLink-typeMypage:hover{
  opacity: 0.7;
}

.boxLink.boxLink-typeMypage::before{
  display: none;
}


.boxLink-typeLogin::before{
  border-color: #333333;
}

.boxLink-typeRsv{
  border-color: #ed0000;
  color: #ffffff;
  background-color: #ed0000;
}

.boxLink-typeRsv::before{
  border-color: #ffffff;
}



/* ==========================================================================
  boxBtn　枠有ボタン
========================================================================== */

.boxBtn{
  background-color: #ffffff;
  border: 1px solid #ed0505;
  display: inline-block;
  color: #ed0000;
  font-size: 1.4rem;
  font-weight: 600;
  padding: 12px 32px 11px 32px;
  position: relative;
  text-align: center;
}

.boxBtn-typeSearch{
  border-color: #ed0000;
  color: #ffffff;
  background-color: #ed0000;
  letter-spacing: 0.5em;
  padding: 12px 46px 11px 46px;
}

.boxBtn-typeSearch:hover{
  opacity: 0.7;
}

.boxBtn-typeSearch::before{
  background-image: url(../img/typeSearch_icon_02.png);
  background-position: 0 center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  content: '';
  display: block;
  font-size: 0;
  height: 18px;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
  opacity: 1;
  width: 16px;
  z-index: 10;
}



/* ==========================================================================
  tandemListBox
========================================================================== */



.tandemListBox{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;

  width: 100%;
}

.tandemListBox > li{
  margin-top: 10px;
}

.tandemListBox > li:first-child{
  margin-top: 0px;
}

.tandemListBox_item{
  border: 2px solid #e6e6e6;
  display: flex;
  padding: 23px 25px 18px 25px;
}

.searchForArea_purpose a:hover .tandemListBox_item{
  border: 2px solid #ed0505;
}

.tandemListBox_item a{
  color: #333333;
  overflow: hidden;
}

.tandemListBox_icon{
  min-width: 102px;
  padding: 0 23px 0 0;
  text-align: center;
}

.tandemListBox_item dl{
  padding: 0 18px 0 0;
  position: relative;
}

.tandemListBox_item dl::after{
  border-top: 1px solid #ed0505;
  border-right: 1px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 2px;
  transform: rotate(45deg);
  width: 6px;
}

.tandemListBox_item dt{
  font-size: 1.8rem;
  font-weight: 600;
}

.tandemListBox_item dd{
  font-size: 1.3rem;
  margin-top: 2px;
}



/* ==========================================================================
  
  sBsListBox side-by-side List
========================================================================== */



.sBsListBox{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.sBsListBox > li{
  width: 16.6666666%;
}

.sBsListBox_item{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0;
}

.sBsListBox_item > img{
  padding-bottom: 15px;
  max-width: auto;
  width: auto;
}

a:hover .sBsListBox_item > img{
  opacity: 0.7;
}

.sBsListBox_item > p{
  padding-right: 18px;
  position: relative;
}

a:hover .sBsListBox_item > p{
  text-decoration: underline;
}

.sBsListBox_item > p::after{
  border-top: 1px solid #ed0505;
  border-right: 1px solid #ed0505;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 2px;
  transform: rotate(45deg);
  width: 6px;
}



/* ==========================================================================
  
  snsLink
========================================================================== */



.snsLink{
  display: flex;
}

.snsLink > li{
  margin-left: 24px;
}

.snsLink > li:first-child{
  margin-left: 0px;
}



/* ==========================================================================
  modalBase
========================================================================== */



.modalBase{
  width: auto;
}

.modalBase.modalBase-typeLogin{
  width: 460px;
}

.modalBase.modalBase-typeSearch{
  width: 800px;
}

.modalBase.modalBase-typeTypeLang{
  width: 460px;
}

.modalBase.modalBase-typeCarSelect{
  width: 800px;
}
.modalBase.modalBase-typeNyukai{
  width: 800px;
}

.modalBase_header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #ed0000;
  color: #ffefef;
  font-size: 2.0rem;
  padding: 15px 22px;
  width: 100%;
}

.modalBase_title{
  font-weight: 600;
  text-align: center;
  width: 100%;
}

.modalBase_title-inSubTitle{
  display: flex;
  align-content: center;
}

.modalBase_header .subTitle{
  font-size: 1.0rem;
  min-width: 132px;
  padding-left: 12px;
  width: 28.6%;

}

.modalBase_close{
  background-color: transparent;
  display: block;
  font-size: 0;
  height: 12px;
  position: relative;
  width: 12px;
}

.modalBase_close::before{
  background: #ffffff;
  content: "";
  height: 15px;
  position: absolute;
  top: 0px;
  right: calc(50% - 1px);
  width: 1px;
  transform: rotate(-45deg);
  z-index: 2;
}

.modalBase_close::after{
  background: #ffffff;
  content: "";
  height: 15px;
  position: absolute;
  top: 0px;
  right: calc(50% - 1px);
  width: 1px;
  transform: rotate(45deg);
  z-index: 2;
}

.modalBase_body{
  background-color: #ffffff;
}

.modalBase-typeLogin .modalBase_body{
  padding: 41px 32px 41px 32px;
}

.modalBase-typeSearch .modalBase_body{
  padding: 60px 66px 60px 60px;
}

.modalBase-typeCarSelect .modalBase_body{
  padding: 60px 66px 60px 60px;
}

.modalBase-typeNyukai .modalBase_body{
  padding: 10px 10px 63px;
}

.headingBlock-styleInformatText{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  font-size: 1.7rem;
  line-height: 1.25;
  margin-bottom: 8px;
  padding-left: 15px;
}

.modalBase-typeSearch input{
  border-color:#cccccc;
  border-right: none;
  font-size: 1.4rem;
  padding: 16px 15px 16px 15px;
}

.modalBase-typeSearch .mf_finder_searchBox_suggest_items{
  z-index: 140;
}

.modalBase-typeSearch .mf_finder_searchBox_submit{
  border: 1px solid #cccccc;
  border-left: none;
  border-radius: 0;
  background-color: transparent;
  opacity: 1;
  width: 48px;
}

.modalBase-typeSearch .mf_finder_searchBox_submit:before{
  background-image: url(../img/typeSearch_icon_01.png);
  background-position: 0 center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  content: '';
  display: block;
  font-size: 0;
  height: 22px;
  position: absolute;
  top: calc(50% - 11px);
  right: 12px;
  opacity: 1;
  width: 20px;
  z-index: 10;
  
}

.modalBase-typeLogin .inputSection:first-child{
  /* margin-bottom: 25px; */
}

.modalBase-typeLogin .headingBlock-styleType01{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 15px;
}


.headingBlock-formatText{
  color: #808080;
  font-size: 1.2rem;
}

.inputText{
  background-color: #ffffff;
  font-size: 1.6rem;
  line-height: 1;
  padding: 9px;
  width: 100%;
}

.modalBase-typeLogin .inputText:last-child{
  margin-bottom: 32px;
}

.modalBase-typeLogin .inputNote{
  color: #808080;
  font-size: 1.2rem;
  margin-top: 9px;
  margin-bottom: 0px
}

.modalBase-typeLogin .inputNote + .inputErr{
  margin-top: 0;
}

.inputPassword{
  background-color: #ffffff;
  font-size: 1.6rem;
  line-height: 1;
  padding: 9px;
  width: 100%;
}

.inputPassword + .inputErr{
  margin-top: 4px;
}

.checkboxWrap{
  margin-top: 19px;
  padding-bottom: 18px;
}

.inputErr + .checkboxWrap{
  margin-top: 14px;
}

.inputCheckbox{
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}

.inputCheckbox+label {
  position: relative;
  display: inline-block;
  font-size: 1.2rem;
  min-width: 20px;
  min-height: 20px;
  padding-left: 30px;
  cursor: pointer;
  vertical-align: middle;
}

.inputCheckbox+label::after,
.inputCheckbox+label::before {
  position: absolute;
  display: block;
  content: '';
  transition-timing-function: ease-in-out;
  transition-duration: .075s;
}

.inputCheckbox+label::before {
  cursor: pointer;
  border: solid 1px #bbb;
  border-radius: 2px;
  background-color: #fff;
  top: -2px;
  left: 0;
  width: 20px;
  height: 20px;
  transition-property: background-color,border-color;
}

.inputCheckbox+label::after {
  display: none;
  top: -5px;
  left: -2px;
  width: 12px;
  height: 8px;
  transition-property: transform;
  -ms-transform: translate(5px,6px) rotate(-45deg);
  transform: translate(5px,6px) rotate(-45deg);
  border-bottom: 3px solid #ed0505;
  border-left: 3px solid #ed0505;
}

.inputCheckbox:checked+label::after {
  display: block;
}



.inputErr{
  color: #ed0000;
  font-size: 1.2rem;
}

.btnSection{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}

.modalBase-typeLogin .boxLink{
  font-weight: 600;
  min-width: 300px;
  min-height: 50px;
  padding: 14px 43px 10px 43px;
}

.modalBase-typeLogin .helpLink{
  border-bottom: 1px solid #e6e6e6;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 27px;
  margin-bottom: 22px;
  padding: 0 0 16px 0;
  width: 100%;
}

.modalBase-typeLogin .helpLink li:last-child{
  margin-left: 30px;
}

.modalBase-typeLogin .helpLink a{
  color: #333333;
  font-size: 1.2rem;
  padding-right: 17px;
  position: relative;
}

.modalBase-typeLogin .helpLink a:hover{
  text-decoration: underline;
}

.modalBase-typeLogin .helpLink a::after{
  border-top: 1px solid #b7b7b7;
  border-right: 1px solid #b7b7b7;
  content: '';
  display: block;
  height: 6px;
  position: absolute;
  top: calc(50% - 5px);
  right: 0px;
  transform: rotate(45deg);
  width: 6px;
}

.modalBase-typeTypeLang .modalBase_body{
  padding: 40px;
}

.modalBase-typeTypeLang ul{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
}

.modalBase-typeTypeLang li{
  text-align: center;
  padding-bottom: 15px;
}

.modalBase-typeTypeLang li:last-child{
  padding-bottom: 0px;
}

.modalBase-typeTypeLang .boxLink-type01{
  min-width: 300px;
}


/*
  customerMenu-**
*/


.modalBase_footer{
  background-color: #ffffff;
  padding: 17px 31px 31px 31px;
  width: 100%;
}





/* modal override
----------------------------------------------------------------- */


.allWrap .modal__container{
  border-radius: 0px;
  padding: 0px;
  max-width: inherit;
  max-height: inherit;
  overflow-y: auto;
}

.allWrap #modalSearch .modal__container{
  overflow: visible;
}

.allWrap .modal__overlay{
  z-index: 130;
}

.allWrap .modal__content{
  margin: 0;
  z-index: 131;
}



/* ==========================================================================
  oAndC
========================================================================== */



.oAndCWrap{
  display:block;
}

.oAndCWrap .typeOaC_panel{
  display:block;
  overflow: hidden;
}

.oAndCWrap.oAndOpen .typeOaC_panel{
  display: inherit;
}

.oAndCWrap.oAndClose .typeOaC_panel{
  display: none;
  padding: 0;
}

.oAcWord-sub{
  cursor: pointer;
}

/*
  Modifier　説明　上下1行間
*/

.viewSW{
  transition:opacity 0.4s linear 0s
}

.viewSW-on{
  opacity: 1;
}

.viewSW-off{
  opacity: 0;
}



/* ==========================================================================
  mypageNonMemberArea mypageMemberArea mypageSRMArea mypagePRMArea
========================================================================== */



.slideArea-NormalAndSRM:not(.mypageNonMemberArea){
  display: none;
}

.customerMenu_item.customerMenu_item-login:not(.mypageNonMemberArea){
  display: none;
}

.datepickerArea_userTypeBox-normal:not(.mypageNonMemberArea){
  display: none;
}

.datepickerArea_userTypeBox-SRMAndPRM:not(.mypageMemberArea){
  display: none;
}

.customerMenu_item.customerMenu_item-myPage:not(.mypageMemberArea){
  display: none;
}

.msArea_box:not(.mypageNonMemberArea){
  display: none;
}

.slideArea-MemberAndPRM:not(.mypageSRMArea){
  display: none;
}

.memberSttsArea-SRM:not(.mypageSRMArea){
  display: none;
}

.slideArea-PRM:not(.mypagePRMArea){
  display: none;
}

.memberSttsArea-PRM:not(.mypagePRMArea){
  display: none;
}

/* ==========================================================================
  会員入会導線モーダル
========================================================================== */
.modal-nyukai_list{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
}
.modal-nyukai_item + .modal-nyukai_item{
  margin-left: 30px;
}
.modal-nyukai_link{
  width: 280px;
  text-align: center;
  letter-spacing: 0.075em;
}
.modal-nyukai_link:hover{
  opacity: 0.7;
}
.modal-nyukai_link a{
  position: relative;
  display: block;
  width: 100%;
  padding: 13px 25px;
  font-size: 16px;
  font-weight: 600;
}
.modal-nyukai_link a:before{
  position: absolute;
  top: 50%;
  right: 18px;
  content: "";
  width: 5px;
  height: 5px;
  transform: translateY(-50%) rotate(45deg);
}
.modal-nyukai_link-type01{
  border: 1px solid #ed0000;
  background-color: #FFF;
}
.modal-nyukai_link-type01 a{
  color: #ed0000;
}
.modal-nyukai_link-type01 a:before{
  border-top: 2px solid #ed0000;
  border-right: 2px solid #ed0000;
}
.modal-nyukai_link-type02{
  border: 1px solid #ed0000;
  background-color: #ed0000;
}
.modal-nyukai_link-type02 a{
  color: #FFF;
}
.modal-nyukai_link-type02 a:before{
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
}



#testDIV{
  border: 1px solid #3ebd7e;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  width: 200px;
  padding: 10px;
  position: fixed;
  top:50%;
  left: 0;
}

#testDIV button{
  font-size: 1.4rem;
  color: #3ebd7e;
  margin-bottom: 8px;
}

#testDIV button.active{
  background-color: rgba(0,0,0,0.1)
}