/********** sample **********/

.sample {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  margin: 0 auto;
}
.sample li {
  width : calc(100% / 3) ;
  border: solid 1px #071B7D;
  padding: 0 0 10px 0;
  margin: 10px 0;
  text-align: center;
}
.sample li p.sample_ttl {
  padding: 4px 0;
  background: #071B7D;
  color: #fff;
  font-size: 17px;
  font-weight: bold;
}
.sample li .sample_inner {
  padding: 0 16px;
}
.sample li img {
  width: 80px;
  margin: 14px 0;
}
.sample_price {
  margin: 0 20px 0 0;
  text-align: right;
}
.price_related {
  margin: 0 0 16px 0;
  font-size: 12px;
  color: #34A4FF;
}
.sample li .price_local {
  text-align: left;
}
.sample li .price_local  span{
  font-size: 8px;
}
.price_total {
  margin: 8px 0 0 0;
  padding: 8px 0 0 0;
  border-top: solid 1px #036eb8;
  font-size: 20px;
}

.cont_ttl span {
  display: block;
  font-size: 12px;
  color: #071B7D;
}


@media screen and (max-width: 1024px) {
  .sample li {
    width : calc(100% / 2) ;
  }
  .sample li p.sample_ttl {
    font-size: 14px;
  }
}
@media screen and (max-width: 800px) {
  .sample li {
    width : 100%;
  }
  .sample li img {
    width: 50px;
   }
}

/********** pricelist_btn **********/

.pricelist_btn {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}
.pricelist_btn li a{
  display: block;
  width: 100%;
  min-width: 328px;
  border: solid 1px #FFB468;
  margin: 16px 0;
  padding: 10px 0;
  border-radius: 26px;
  background: #F2800E;
  text-align: center;
  transition: 1s;
  box-shadow:   0px 1px 3px rgba(0, 0, 0, 0.18)
}
.pricelist_btn li a:hover{
    background: #FFB468;
}
.pricelist_btn li:nth-child(2n) a{
  margin: 16px 0 16px 72px;
}

/********** price **********/

h3#pricelistmenu.cont_ttl {
  margin: 100px auto 0 auto;
  font-weight: 400;
}
h3#pricelistmenu.cont_ttl:first-of-type{
  margin: 65px auto 0;
}
#price h4{
  margin: 50px 0 0 0;
  padding: 6px 20px 6px 69px;
  background-image: url(../images/price/ic_price01.png);
  background-repeat: no-repeat;
  background-size: 50px;
  background-position: center left 10px;
  font-size: 20px;
}
#price h4.price02{
  background-image: url(../images/price/ic_price04.png);
}
h4.price03{
  margin: 50px 0 0 0;
  padding: 6px 20px 6px 69px;
  background-image: url(../images/price/ic_price02.png);
  background-repeat: no-repeat;
  background-size: 50px;
  background-position: center left 10px;
  font-size: 20px;
}
#price h4.price04{
  background-image: url(../images/price/ic_price03.png);
}
#price h2.price05{
  background-image: url(../images/price/ic_price04.png);
}
#price h2.price06{
  background-image: url(../images/price/ic_price05.png);
}
#price h2.price07{
  background-image: url(../images/price/ic_price06.png);
}


table caption{
  margin: 60px 0 0 0; 
  padding: 10px 0;
  background: #34A4FF;
  color: #fff;
}
.table *, .table *:before, .table *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
table {
	width: 90%;
  margin: 0 auto;
	border-collapse: collapse;
}
table:last-child {
  margin: 0 auto 60px auto;
} 
table tr {
  background: #fff;
}
table tr:nth-child(2n) {
  background: #F9FCFF;
}
table th,table td {
	padding: 10px;
	/* border: 1px solid #dddddd; */
}
table td.menu {
  width: 23%;
  line-height: 1.3;
}
table td {
  border-bottom: 1px solid #cbcbcb;
  padding: 2% 5px;
  font-size: 15px;
}
table td.price_en {
  padding-right: 2em;
  text-align: right;
  width: 24%;
  line-height: 1.3;
  word-break: break-word;
}
table td.summary {
  font-size: 14px;
  line-height: 1.3;
}

.pay {
  margin: 50px auto 0 auto;
}

.topBtn {
  position:fixed; 
  bottom:20px; 
  right:20px;
  display:block;
  background-color:#34A4FF;
  color:#fff;
  text-decoration:none;
  font-weight:bold;
  font-size:11px;
  width:60px;
  height:60px;
  text-align:center;
  line-height:22px;
  border-radius:30px;
  padding-top:30px;
  box-sizing:border-box;
}
.topBtn:before {
  content:'\25B2';
  position:absolute;
  top:10px;
  left:0;
  width:100%;
  text-align:center;
  font-size:20px;
}
.topBtn:hover {
  opacity:0.7;
}


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

  .pricelist_btn li {
    width : 48% ;
    margin: 16px 2% 16px 0 ;
  }
  .pricelist_btn li:nth-child(2n) {
    width : 48% ;
    margin: 16px 0 16px 2% ;
  }
  .pricelist_btn li a{
    min-width: initial;
    margin: 0;
  }
  .pricelist_btn li a:hover{
      background: #FFB468;
  }
  .pricelist_btn li:nth-child(2n) a{
    margin: 0;
  }
}
.sp-br{
  display: none;
}
@media screen and (max-width: 800px) {
  .price_samll {
    font-size: 11px;
  }
  #price h2 {
    font-size: 16px;
  }
  .sp-br{
    display: block;
  }
  table{
    width: 100%;
  }
}

@media(max-width: 600px){
  table td.price_en {
    padding-right: 0.8em;
    width: 32%;
  } 
}

@media screen and (max-width: 360px) {
  .pricelist_btn {
    display: block;
  }
  .pricelist_btn li {
    width: 100%;
  }
  .pricelist_btn li:nth-child(2n) {
    width: 100%;
  }
}

/* for Mac */
.bold{
  font-weight: 700;
}
.price-swich_btn{
  position: relative;
  display: block;
  padding: 6px 0 7px;
  margin: 4px auto 0;
  width: 300px;
  color: #fff;
  font-weight: 700;
  text-align: center;
  background: #071B7D;
  border: 2px solid #071B7D;
  transition: all 0.2s ease-in-out;
  box-sizing: border-box;
}
.price-swich_btn::after{
  content: '';
  position: absolute;
  top: 50%;
  right: 2em;
  transform: translateY(-50%);
  display: block;
  clip-path: polygon(39% 14%, 52% 0, 100% 50%, 52% 100%, 39% 86%, 76% 50%);
  height: 0.74em;
  aspect-ratio: 1;
  background-color: #fff;
  transition: all 0.2s ease-in-out;
}
.macPrice-other_text{
  margin: 12px auto 0;
  width: 90%;
}
.btnList-outer{
  display: flex;
  flex-direction: column;
  gap: 56px;
  padding: 40px 0 90px;
  color: #071B7D;
  font-weight: 700;
  width: 90%;
  margin: 0 auto;
}
.btnList{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}
.btnList li{
  width: 31.25%;
}
.btnList-outer li h4{
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
  font-size: 1.3em;
}
.btnList li a{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 13px 0 14px;
  width: 100%;
  color: #fff;
  font-size: 1.28em;
  line-height: 1.2;
  text-align: center;
  background: #071b7d;
  border: 2px solid #071B7D;
  transition: all 0.2s ease-in-out;
}
.btnList li a::after{
  content: '';
  position: absolute;
  top: 50%;
  right: 2em;
  transform: translateY(-50%);
  display: block;
  clip-path: polygon(39% 14%, 52% 0, 100% 50%, 52% 100%, 39% 86%, 76% 50%);
  height: 0.74em;
  aspect-ratio: 1;
  background-color: #fff;
  transition: all 0.2s ease-in-out;
}
.btnList li a:hover,
.price-swich_btn:hover{
  color: #071b7d;
  background-color: #fff;
}
.btnList li a:hover::after,
.price-swich_btn:hover::after{
  background-color: #071b7d;
}

.macPrice-detail h4{
  padding: 9px 0 10px 18px;
  margin: 0 auto 32px;
  color: #071b7d;
  font-size: 1.85em;
  font-weight: 700;
  background: #F6FAFD;
  border-left: 5px solid #071b7d;
  width: 90%;
}
.macPrice-detail_list{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  padding: 0 0 60px;
  width: 90%;
  margin: 0 auto;
}
.macPrice-detail_list::after,
.btnList::after{
    content: "";
    width: 31.25%;
    background-color: rgba(0,0,0,0);
}
.macPrice-detail_list li{
  width: 31.25%;
}
.macPrice-detail_title{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 13px 0 14px;
  width: 100%;
  max-height: 56px;
  color: #fff;
  font-size: 1.28em;
  line-height: 1.2;
  text-align: center;
  background: #071b7d;
  border: 2px solid #071B7D;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
}
.macPrice-detail_title.small{
  font-size: 1.05em;
}
.macPrice-detail_title::after{
  content: '';
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%) rotate(90deg);
  display: block;
  clip-path: polygon(39% 14%, 52% 0, 100% 50%, 52% 100%, 39% 86%, 76% 50%);
  height: 15px;
  aspect-ratio: 1;
  background-color: #fff;
  transition: all 0.2s ease-in-out;
}
.macPrice-detail_title.open::after{
  transform: translateY(-50%) rotate(-90deg);
}

.macPrice-detail_box{
  display: none;
  padding: 0 7px 18.5px;
  background: #EAEFFD;
}
@keyframes appear {
  0%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}
.macPrice-detail_box dl{
  display: flex;
  padding: 12px 20px;
  border-bottom: 1px solid #fff;
  font-size: 0.90em;
}
.macPrice-detail_box dl dt{
  width: 70%;
  color: #111B7D;
  font-weight: 700;
}

@media(max-width: 900px){
  .btn-list,
  .macPrice-detail_list{
    flex-direction: column;
  }
  .btnList li,
  .macPrice-detail_list li{
    width: 100%;
  }
  .macPrice-detail_box dl{
    font-size: 1em;
  }
}

