@media screen and (min-width: 768px) {
  .bdR{border-right: 1px solid #ccc !important;}
#wrapScrollXTable {
    max-width: 980px;
    padding: 0;
  margin: 0 auto;
  position: relative;
  background: #fff;
}
#wrapScrollXTable .table-wrap {
  overflow-x: scroll;
  /*border-right: 1px solid #ccc;  */
}
#wrapScrollXTable .table {
  width: 1470px;
  border-collapse: separate;
  /*border-left: 1px solid #ccc;*/
}
#wrapScrollXTable .table th,
#wrapScrollXTable .table td {
  border: solid 1px #ccc; 
  padding: 20px 8px;
width: 210px;
}
#wrapScrollXTable .table td{
  padding:20px 8px ;
  text-align: right;
}
#wrapScrollXTable .table td.tdTop{
  padding: 35px 8px;
  font-weight: bold;
  text-align: center;
}


#wrapScrollXTable .table th,#wrapScrollXTable .tableInner th{border-bottom: 0;}
#wrapScrollXTable .table tr:last-child th,#wrapScrollXTable .tableInner tr:last-child th{border-bottom: 1px;}
#wrapScrollXTable .table td,#wrapScrollXTable .tableInner td{border-left: none; border-bottom: 0;}
#wrapScrollXTable .table td:last-child,#wrapScrollXTable .tableInner td:last-child{border-right: none;}
#wrapScrollXTable .table tr:last-child td,#wrapScrollXTable .tableInner tr:last-child td{border-bottom: 1px;}
/*#wrapScrollXTable .tableInner td:last-child{border-right: none;}*/
#wrapScrollXTable .table td.noPad{padding: 0; border: none;}
#wrapScrollXTable .table th.bdBtm,#wrapScrollXTable .table td.bdBtm{border-bottom: 1px solid #ccc;}
#wrapScrollXTable .table td .tdTxt{width:190px ; display: inline-block;}
#wrapScrollXTable .table td .txtPrice{font-weight: bold;}
#wrapScrollXTable .table td.bgOrange{background: #FFF8EF; color: #EB5505;}
#wrapScrollXTable .table th .thTxt{display: block; position: relative; height: 100%;}
#wrapScrollXTable .table td .iconRecom{
        display: block;
        width: 7em;
        line-height: 22px;
        padding: 0;
        background: #EB5505;
        border-radius: 11px;
        margin: 0 auto 3px;
        color: #fff;
        font-size: 14px;
}

.noteBtm{
    display: block;
    position: absolute;
    bottom: 20px;
    width: 7em;
    /* left: calc(50% - 3.5em);*/
}

/**/
#wrapScrollXTable .table th.thStable {

    left: -1px !important;
    border-left: none !important;

}

#wrapScrollXTable .table th.thStable::before {
  content: '';
  position: absolute;
  left: 0;
  inset: 1px; 
  border-left: 1px solid #ccc;
  pointer-events: none;
  height: 100%;
  width: 100%;
}
  


.toggleBoxCharge{
	position: relative;
	padding: 52px 0 0 0;
}
.toggleBoxCharge.all{/*border-bottom: 1px solid #ccc;border-left: 1px solid #ccc;*/}
.toggleBoxCharge.all .wrapTableCharge{border-bottom: 1px solid #ccc;}
.tgl-trig-parent{
	display: block; 
	width: 750px;
position: absolute;
top: 10px;
z-index: 10;
padding: 5px;
background: #fff;
border: solid 1px #ccc;
border-radius: 8px;
}
.tgl-trig-Orange{background: #EB5505; color: #fff;border: solid 1px #EB5505;}
.tgl-trig-parent.all{width: 960px;}
.tgl-trig-parent::after {
        content: '\FF1E';
        display: block;
        position: absolute;
        top: calc(50% - 12px);
        right: 1.2em;
        font-weight: bold;
        transform: rotate(90deg) scale(.6, 1);
        font-size: 20px;
    }
.tgl-trig-parent.open::after {
        transform: rotate(270deg) scale(.6, 1);
}

.wrapNote{max-width: 980px; padding: 20px 10px;    position: sticky;
    left: 0;}

#btnScrollable{
  width: 160px;
  height: 160px;
background: url(/content/dam/au-com/pr/newplan/img/btn-scrollable_9a98ef191f19851d.webp);
background-size: 160px auto;
background-position: center center;
background-repeat: no-repeat;
z-index: 20;
position: absolute;
top: calc(50% - 80px);
left: calc(50% - 80px);
}

}
@media screen and (min-width: 768px) and (max-width: 980px) {
	.tgl-trig-parent{width: calc(100vw - 243px);}
	.tgl-trig-parent.all{width: calc(100vw - 33px);}
  .wrapNote{width: calc(100vw - 20px);  padding: 20px;  position: sticky;
    left: 0;}
}

@media screen and (min-width: 0px) and (max-width: 767.98px) {
.bdR{border-right: .2vw solid #ccc !important;}
#wrapScrollXTable {
    width:100%;
    padding: 0;
  margin: 0 auto;
  position: relative;
  background: #fff;
}
#wrapScrollXTable .table-wrap {
  overflow-x: scroll;
  /*border-left: .2vw solid #ccc;*/
/*  border-right: .2vw solid #ccc;*/
  
}
#wrapScrollXTable .table {
  width: 230vw;
  border-collapse: separate;
  /*border-left: .2vw solid #ccc;
  border-right: .2vw solid #ccc;*/
}
#wrapScrollXTable .table th{
  border: .2vw solid #ccc;
  padding:5vw 2vw;
width: 26vw;
}
#wrapScrollXTable .table td{
  border: .2vw solid #ccc;
  width: 34vw;
    padding:5vw 2vw ;
    text-align: right;
}

/*#wrapScrollXTable .table td:last-child{border-right: .4vw solid #ccc;}*/
#wrapScrollXTable .table td.tdTop{
  font-weight: bold;
  text-align: center;
}


#wrapScrollXTable .table th,#wrapScrollXTable .tableInner th{border-bottom: 0;}
#wrapScrollXTable .table tr:last-child th,#wrapScrollXTable .tableInner tr:last-child th{border-bottom: .2vw;}
#wrapScrollXTable .table td,#wrapScrollXTable .tableInner td{border-left: none; border-bottom: 0;}
#wrapScrollXTable .table tr:last-child td,#wrapScrollXTable .tableInner tr:last-child td{border-bottom: .2vw;}
#wrapScrollXTable .table td:last-child,#wrapScrollXTable .tableInner td:last-child{border-right: none;}
/*#wrapScrollXTable .tableInner td:last-child{border-right: none;}*/
#wrapScrollXTable .table td.noPad{padding: 0;}
/*#wrapScrollXTable .table th.bdBtm,#wrapScrollXTable .table td.bdBtm{border-bottom: .2vw solid #ccc;}*/

/*#wrapScrollXTable .table th .thTxt{width:33.6vw ; display: block;}
#wrapScrollXTable .table td .tdTxt{width:45.8vw ; display: block;}*/

#wrapScrollXTable .table td .txtPrice{font-weight: bold;}
#wrapScrollXTable .table td.bgOrange{background: #FFF8EF; color: #EB5505;}
#wrapScrollXTable .table td .iconRecom{
    display: block;
    width: 7em;
    line-height: 5vw;
    padding: 0;
    background: #EB5505;
    border-radius: 2.5vw;
    margin: 0 auto 1vw;
    color: #fff;
    font-size: 3vw;
}

.noteBtm{
    display: block;
    position: absolute;
    bottom: 5vw;
    width: 7em;
    /* left: calc(50% - 3.5em);*/
}

/*
#wrapScrollXTable .table th.thStable{border: none;}
#wrapScrollXTable .table th.thStable::before {
  content: '';
  position: absolute;
  inset: .2vw; 
  border: .2vw solid #ccc;
  pointer-events: none;
  height: 100%;
  width: 100%;
}
  */

.toggleBoxCharge{
	position: relative;
	padding: 16vw 0 0 0;
  
}
.toggleBoxCharge.all{/*border-bottom: .2vw solid #ccc;border-left: .2vw solid #ccc;*/}
.toggleBoxCharge.all .wrapTableCharge{border-bottom: .2vw solid #ccc;}
.tgl-trig-parent{display: block;
   width: calc(62.7vw - 34px);
position: absolute;
top: 2.4vw;
z-index: 5;
padding: 3vw;
background: #fff;
border-radius: 1.6vw;
border: solid .2vw #ccc;
}
.tgl-trig-Orange{background: #EB5505; color: #fff;border: solid .2vw #EB5505;}
.tgl-trig-parent.all{width:calc(90vw - 34px);}
.tgl-trig-parent::after {
        content: '\FF1E';
        display: block;
        position: absolute;
        top: calc(50% - 2.4vw);
        right: 3vw;
        font-weight: bold;
        transform: rotate(90deg) scale(.6, 1);
        font-size: 4vw;
    }
.tgl-trig-parent.open::after {
        transform: rotate(270deg) scale(.6, 1);
}

.wrapNote{
          width: calc(90vw - 34px);
        padding: 5vw 0;
        position: sticky;
        left: 10px;
}

#btnScrollable{
  width: 34vw; 
  height: 34vw;
background: url(/content/dam/au-com/pr/newplan/img/btn-scrollable_9a98ef191f19851d.webp);
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
z-index: 10;
position: absolute;
top: calc(50% - 17vw);
left: calc(50% - 17vw);
}

}

#wrapScrollXTable .tableInner{border-collapse: separate;}
/* 左端固定（.thStable） */
#wrapScrollXTable .table th.thStable {
    position: sticky;
    left: 0;
    z-index: 5; 
    background: #eee;
}
.tgl-trig-parent{transition: none !important;}