button,
input,
select,
textarea {
  font: inherit;
}

button {
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
}

figure {
  padding: 0;
  margin: 0;
}
.elem-hero-next0 {
  background-image: url(../images/hero-next0_pc.jpg);
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (max-width: 640px) {
  .elem-hero-next0 {
    background-image: url(../images/hero-next0_sp.jpg);
    background-position: 50% 0;
  }
}

.elem-hero-next0 .elem-hero-inner {
  padding-top: 40px;
  padding-bottom: 760px;
}

.elem-hero-next0 .txt1 {
  color: #e9dca6;
  font-size: 40px;
  text-align: center;
  line-height: 1.4;
}
.elem-hero-next0 .elem1 {
  max-width: 860px;
  margin: 30px auto 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-wrap: nowrap;
  background-color: rgba(243, 243, 255, 0.85);
  padding: 20px 40px;
  /* padding-right: 0; */
}
.elem-hero-next0 .elem1 .part-card {
  width: 30%;
}
.elem-hero-next0 .elem1 .part-cname img {
  width: auto;
  height: 40px;
  margin-top: 15px;
}
.elem-hero-next0 .elem1 .part-txt {
  /* flex: 1; */
  text-align: center;
  /* padding: 0 30px; */
  padding-left: 60px;
}
.elem-hero-next0 .elem1 .txt2 {
  font-size: 22px;
  color: #8c7721;
}
.elem-hero-next0 .part-txt .part-name {
  font-size: 18px;
  padding-top: 0.6em;
}
.elem-hero-next0 .part-txt .part-price {
  font-size: 36px;
  color: #8c7721;
  /* margin-top: -0.5em; */
  line-height: 1;
}
.elem-hero-next0 .part-txt .part-price span {
  font-size: 170%;
  display: inline-block;
  position: relative;
  top: 0.05em;
  margin: 0 0.15em;
}

/* .elem-txt2-code-space .part-card{
	width: 300px;
}
.elem-txt2-code-space .part-txt .part-name{
	font-size: 14px;
	padding-top: 1em;
}

.elem-txt2-code-space .part-txt .part-lead{
	color: #7e3c92;
	font-weight: bold;
	border-top: 1px solid #AAA;
	margin-top: 0.5em;
	padding-top: 0.3em;
}
.elem-txt2-code-space .part-txt .part-lead span{
	font-size: 180%;
}
.elem-txt2-code-space .notes{
	color: #000;
	text-align: justify;
} */

@media only screen and (max-width: 640px) {
  .elem-hero-next0 .elem1 {
    flex-direction: column;
    align-items: center;
    padding: 20px;
    margin-top: 59vw;
  }
  .elem-hero-next0 .elem-hero-inner {
    padding: 5vw 5vw 5vw;
    width: 100%;
  }
  .elem-hero-next0 .txt1 {
    font-size: 24px;
  }
  .elem-hero-next0 .elem1 .part-card {
    width: 50%;
    margin-bottom: 4vw;
  }
  .elem-hero-next0 .elem1 .part-cname img {
    width: 100%;
    height: auto;
    margin-top: 3vw;
  }
  .elem-hero-next0 .elem1 .part-txt {
    padding: 0;
  }
  .elem-hero-next0 .elem1 .txt2 {
    font-size: 14px;
  }
  .elem-hero-next0 .part-txt .part-price {
    font-size: 20px;
    margin-top: 0;
  }
  .elem-hero-next0 .part-txt .part-name {
    font-size: 14px;
  }
  /* .elem-txt2-code-space .part-card{
		width: 70%;
	}
	.elem-txt2-code-space .part-txt .part-name{
		font-size: 12px;
	}
	.elem-hero-space .elem-hero-inner {
		padding: 5.4vw 6vw 7.5vw;
	} */
}

@media only screen and (min-width: 641px) {
  .mynum_in .contents_pop {
    padding: 60px;
  }
}
.mynum_in .txt_in {
  width: 860px;
}
.mynum_in .part-title {
  text-align: center;
}

.mynum_in .part-title .part2 {
  border-top: 1px solid #333;
  padding-top: 0.5em;
  margin-top: 0.5em;
}

.mynum_in .btn-wrap {
  padding-top: 20px;
}
.mynum_in .part-btn.red {
  background-color: #bb1010;
}
.mynum_in .part-btn {
  text-align: center;
  background-color: #16910e;

  width: calc(50% - 10px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.mynum_in .part-btn {
  color: #fff;
  padding: 10px 20px;
}
/* .mynum_in .part-btn a{
	color: #FFF;padding: 10px 20px;
	width: 100%;
	height: 100%;
} */

.mynum_in .btn-type-ell {
  margin-top: 20px;
  width: 100%;
  height: 38px;
  border-radius: 19px;
  background-color: #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mynum_in .btn-type-ell {
  color: #000;
  width: 100%;
}

@media only screen and (max-width: 640px) {
  .mynum_in .txt_in {
    width: 100%;
  }
  .mynum_in .part-btn a {
    font-size: 12px;
  }
}

@media only screen and (min-width: 641px) {
  .mynum_in a:hover {
    opacity: 0.7;
  }
}

.elem-keys:last-of-type {
  padding-bottom: 0;
}

/* 2302 campaign */

.elem-hero-inner .txt1b {
  color: #e9dca6;
  font-size: 18px;
  margin-bottom: 40px;
}
.elem-hero-inner .elem2 {
  margin-top: 10px;
}
.elem-hero-inner .elem2 a {
  display: block;
  width: 600px;
  margin: 0 auto;
}
.elem-hero-inner .elem2 a .btn-txt {
  text-align: center;
  background-color: #b7a366;
  color: #fff;
  line-height: 1;
  font-size: 18px;
  padding: 0.3em 0 0.4em;
}
@media only screen and (max-width: 640px) {
  .elem-hero-inner .txt1b {
    font-size: 16px;
    margin-bottom: 5vw;
  }
  .elem-hero-inner .elem2 {
    margin-top: 59vw;
  }
  .elem-hero-inner .elem2 a {
    width: 100%;
  }
  .elem-hero-inner .elem2 a .btn-txt {
    font-size: 12px;
  }
}

.camp2302 a {
  color: #666;
  text-decoration: underline;
}
.camp2302 .red {
  color: #ae0000;
}
.camp2302 .sizeL {
  font-size: 160%;
}
.camp2302 * + .fill1 {
  margin-top: 1em;
}
.camp2302 .fill1 {
  background-color: #eee;
  padding: 0.5em;
}

.camp2302 * + .part-table {
  margin-top: 1em;
}
.camp2302 .part-table {
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 1px;
  text-align: center;
  width: 100%;
  margin-bottom: 2em;
}
.camp2302 .part-table th {
  background-color: #16910e;
  color: #fff;
}
/* .camp2302 .part-table.color2 th:nth-child(1){background-color: #917d0e;}
.camp2302 .part-table.color2 th:nth-child(2){background-color: #0e9191;}
.camp2302 .part-table.color2 th:nth-child(3){background-color: #910e0e;} */
.camp2302 .part-table.color2 th:nth-child(1) {
  background-color: #8e8b7a;
}
.camp2302 .part-table.color2 th:nth-child(2) {
  background-color: #6f9393;
}
.camp2302 .part-table.color2 th:nth-child(3) {
  background-color: #977676;
}
.camp2302 .part-table td {
  background-color: #eee;
}
.camp2302 .part-table tr > * {
  padding: 0.5em 0.8em;
}

.contents_pop .notes02 .red {
  color: #bb1010;
}

.elem-hero:not(.type-MB7) {
  background-image: url(/amextop/clgold-g1-01/img/hero-notxt_pc.jpg);
}
.elem-hero.size2 .elem-hero-inner {
  padding-top: 90px;
}
.com-cta .btn-sq > * {
  padding: 1.3em 0 1.3em 0;
}
/* .com-cta .btn-sq>* {
		padding-left: 0;
	} */
@media only screen and (min-width: 641px) {
  .elem-hero:not(.type-MB7) {
    height: 290px;
  }
  /* .hero-mess{
			padding: 40px 0 0;
		} */
  /* .elem-hero .txt1 {
			width: 446px;
		} */
}
@media only screen and (max-width: 640px) {
  .elem-hero:not(.type-MB7) {
    background-image: url(/amextop/clgold-g1-01/img/hero-notxt_sp.jpg);
  }
  .elem-hero.size2 .elem-hero-inner {
    padding-top: 90px;
  }
}
.com-cta .title-wrap .title + .notes {
  margin-top: -1em;
  margin-bottom: 2em;
}
@media only screen and (max-width: 640px) {
  .com-cta .title-wrap .title + .notes {
    margin-top: 0.5em;
    font-size: 10px;
  }
}
@media only screen and (min-width: 641px) {
  .elem-txt2-code.size2 .elem-txt .part-lead2 {
    font-size: 18px;
  }
}

#camp2302,
.js-campbnr,
.js-part {
  display: none;
}

:root {
  --js-txt01_pc: 21px;
  --js-txt01_sp: 3.4vw;
}
.elem-hero .txt1-code {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px 0 15px 0.5em;
}
.elem-hero .txt1-code > * {
  text-align: center;
  line-height: 1.3;
  letter-spacing: 0.2em;

  color: #e1d67d;
  -webkit-font-smoothing: antialiased;
  background: linear-gradient(135deg, #f5e3b4 0%, #f2eb80 41%, #f6f1c5 48%, #f2eb80 70%, #f5e3b4 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0.1em 0.1em rgba(0, 0, 0, 0.4));
}
.elem-hero .txt1-code .t1 {
  /* font-size: 20px; */
  font-size: var(--js-txt01_pc);
  font-weight: bold;
  filter: drop-shadow(0 0.2em 0.2em rgba(0, 0, 0, 0.4));
  margin-bottom: 0.2em;
}
.elem-hero .txt1-code .t2 {
  font-size: 46px;
}
.elem-hero .txt1-code .t3 {
  font-size: 46px;
  letter-spacing: 0.43em;
  text-indent: 0.3em;
}
@media only screen and (max-width: 640px) {
  .elem-hero .txt1-code .t1 {
    /* font-size: 12px; */
    font-size: var(--js-txt01_sp);
  }
  .elem-hero .txt1-code .t2 {
    font-size: 26px;
  }
  .elem-hero .txt1-code .t3 {
    font-size: 26px;
  }
}

.js-campbnr.MB7 > * {
  margin-top: 2em;
  padding-bottom: 2em;
}

/** CAMPAIGN BLOCK
==============================================*/
.campaign-block__banner {
  display: block;
  width: 100%;
}
.campaign-block__banner img {
  width: 100%;
}
@media only screen and (min-width: 641px) {
  .campaign-block {
    padding-bottom: 50px;
  }
}
@media only screen and (max-width: 640px) {
  .campaign-block {
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
  }
}

/** MODAL OPEN
==============================================*/
[data-micromodal-transition] {
  -webkit-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
  opacity: 0;
}

[data-micromodal-transition].is-open {
  opacity: 1;
}

@media screen and (min-width: 641px) {
  .modal-open {
    cursor: pointer;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }
  .modal-open:hover {
    opacity: 0.8;
  }
}

/** MODAL MICROMODAL
==============================================*/
.modal-micromodal {
  display: none;
}

.modal-micromodal.is-open {
  display: block;
}

@-webkit-keyframes modalfadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes modalfadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes modalfadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes modalfadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.modal-micromodal[aria-hidden="false"] .modal-overlay {
  -webkit-animation: modalfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
  animation: modalfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
.modal-micromodal[aria-hidden="true"] .modal-overlay {
  -webkit-animation: modalfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
  animation: modalfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

/** MODAL OVERLAY
==============================================*/
.modal-overlay {
  background: rgba(0, 0, 0, 0.8);
  bottom: 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 641px) {
  .modal-overlay {
    padding: 20px;
  }
}
@media screen and (max-width: 640px) {
  .modal-overlay {
    padding: 0 10px;
  }
}

/** MODAL CONTAINER
==============================================*/
/* close button */
.modal-close__button {
  display: block;
  border: 2px solid #333;
  width: 100%;
  font-weight: 700;
  font-size: 21px;
  padding: 10px;
  text-align: center;
  position: relative;
  background-color: #fff;
}
.modal-close__button:before {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  background-color: #f2f2f2;
  border-radius: 50%;
  right: 20px;
  top: calc(50% - 12px);
}
.modal-close__button:after {
  content: "";
  position: absolute;
  width: 9px;
  height: 10px;
  background-color: #333;
  -webkit-clip-path: polygon(9px 50%, 0% 0%, 0% 10px);
  clip-path: polygon(9px 50%, 0% 0%, 0% 10px);
  right: 26px;
  top: calc(50% - 05px);
}

/* container */
.modal-container {
  max-height: calc(100vh - 40px);
}
.modal-container:focus {
  outline: none;
}
.modal-container:before,
.modal-container:after {
  content: "";
  background-color: #fff;
  position: absolute;
  right: 0;
  width: 40px;
  cursor: pointer;
  height: 2px;
}
.modal-container:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.modal-container:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
@media screen and (min-width: 641px) {
  .modal-container {
    width: 922px;
  }
  .modal-container:before,
  .modal-container:after {
    left: 100%;
    bottom: 100%;
  }
}
@media screen and (max-width: 640px) {
  .modal-container:before,
  .modal-container:after {
    right: 0;
    top: -40px;
  }
}

/** MODAL CONTENT
==============================================*/
.modal-content {
  line-height: 1.5;
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  max-height: calc(100vh - 40px - min(32vw, 160px));
}
.modal-content::-webkit-scrollbar {
  width: 3px;
}
.modal-content::-webkit-scrollbar-thumb {
  background-color: #d2d2d2;
}
@media screen and (min-width: 641px) {
  .modal-content {
    padding: 0 20px;
  }
}
@media screen and (max-width: 640px) {
  .modal-content {
    padding: 0 10px;
  }
}

/** MODAL INNER
==============================================*/
.modal-inner {
  background-color: #fff;
}
@media screen and (min-width: 641px) {
  .modal-inner {
    padding: 40px;
  }
}
@media screen and (max-width: 640px) {
  .modal-inner {
    padding: 40px 15px;
  }
}

/** MODAL INFORMATION
==============================================*/
.modal-information__title {
  text-align: center;
  font-weight: 500;
  color: #c9a203;
}
@media screen and (min-width: 641px) {
  .modal-information__title {
    font-size: 18px;
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 640px) {
  .modal-information__title {
    font-size: 16px;
    margin-bottom: 20px;
  }
}

.modal-information__box:not(:first-child) {
  margin-top: 30px;
}

.modal-information__sub-ttl {
  text-align: center;
  font-weight: 500;
  color: #c9a203;
  border-top: 1px solid #c9a203;
  border-bottom: 1px solid #c9a203;
}
.modal-information__info > *:not(:first-child) {
  margin-top: 15px;
}
@media screen and (min-width: 641px) {
  .modal-information__sub-ttl {
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 25px;
  }
  .modal-information__notes > li {
    font-size: 14px;
  }
}
@media screen and (max-width: 640px) {
  .modal-information__sub-ttl {
    font-size: 14px;
    padding-top: 05px;
    padding-bottom: 05px;
    margin-bottom: 20px;
  }
  .modal-information__notes > li {
    font-size: 12px;
  }
}

.modal-information__table {
  width: 100%;
  border-top: 1px solid #bdb1aa;
  border-left: 1px solid #bdb1aa;
  border-bottom: 1px solid #bdb1aa;
}
.modal-information__table th,
.modal-information__table td {
  text-align: center;
  font-weight: 500;
  vertical-align: middle;
}
.modal-information__table tr:not(:first-child) th,
.modal-information__table tr:not(:first-child) td {
  border-top: 1px solid #bdb1aa;
}
.modal-information__table th,
.modal-information__table td {
  border-right: 1px solid #bdb1aa;
}
.modal-information__table th {
  background-color: #c9a203;
  color: #fff;
}
.modal-information__table td {
  background-color: #f9f0eb;
}
@media screen and (min-width: 641px) {
  .modal-information__table th,
  .modal-information__table td {
    font-size: 16px;
    padding: 10px;
  }
}
@media screen and (max-width: 640px) {
  .modal-information__table th,
  .modal-information__table td {
    font-size: 11px;
    padding: 05px;
    letter-spacing: 0;
  }
}

.modal-information__table--4col th,
.modal-information__table--4col td {
  width: 25%;
}

/** ENTRT MODAL
==============================================*/
@media only screen and (min-width: 641px) {
  .entry-modal > * {
    margin-right: auto;
    margin-left: auto;
  }
}

.entry-modal .entry-modal__ttl {
  font-size: 16px;
  text-align: center;
  padding-bottom: 0.5em;
}
#modal-gold-entry .entry-modal .entry-modal__ttl {
  color: #c9a203;
  border-bottom: 1px solid #c9a203;
}
#modal-rose-entry .entry-modal .entry-modal__ttl {
  color: #ae4c61;
  border-bottom: 1px solid #ae4c61;
}
@media only screen and (min-width: 641px) {
  .entry-modal .entry-modal__ttl {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 640px) {
  .entry-modal .entry-modal__ttl {
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 641px) {
  .entry-modal .entry-modal__txt {
    font-size: 18px;
  }
}
@media only screen and (max-width: 640px) {
  .entry-modal .entry-modal__txt {
    font-size: 15px;
  }
}

/** MODAL INFORMATION
==============================================*/
.modal-information__title {
  text-align: center;
  font-weight: 500;
  color: #c9a203;
}
@media screen and (min-width: 641px) {
  .modal-information__title {
    font-size: 18px;
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 640px) {
  .modal-information__title {
    font-size: 16px;
    margin-bottom: 20px;
  }
}

.modal-information__box:not(:first-child) {
  margin-top: 30px;
}

.modal-information__sub-ttl {
  text-align: center;
  font-weight: 500;
  color: #c9a203;
  border-top: 1px solid #c9a203;
  border-bottom: 1px solid #c9a203;
}
.modal-information__info > *:not(:first-child) {
  margin-top: 15px;
}
@media screen and (min-width: 641px) {
  .modal-information__sub-ttl {
    font-size: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 25px;
  }
  .modal-information__txt {
    font-size: 14px;
  }
  .modal-information__notes > li {
    font-size: 12px;
  }
}
@media screen and (max-width: 640px) {
  .modal-information__sub-ttl {
    font-size: 14px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 20px;
  }
  .modal-information__txt {
    font-size: 14px;
  }
  .modal-information__notes > li {
    font-size: 12px;
  }
}

.modal-information__table {
  width: 100%;
  border-top: 1px solid #bdb1aa;
  border-left: 1px solid #bdb1aa;
  border-bottom: 1px solid #bdb1aa;
}
.modal-information__table th,
.modal-information__table td {
  text-align: center;
  font-weight: 500;
  vertical-align: middle;
}
.modal-information__table tr:not(:first-child) th,
.modal-information__table tr:not(:first-child) td {
  border-top: 1px solid #bdb1aa;
}
.modal-information__table th,
.modal-information__table td {
  border-right: 1px solid #bdb1aa;
}
.modal-information__table th {
  background-color: #c9a203;
  color: #fff;
}
.modal-information__table td {
  background-color: #f9f0eb;
}
@media screen and (min-width: 641px) {
  .modal-information__table th,
  .modal-information__table td {
    font-size: 13px;
    padding: 10px;
  }
}
@media screen and (max-width: 640px) {
  .modal-information__table th,
  .modal-information__table td {
    font-size: 11px;
    padding: 5px;
    letter-spacing: 0;
  }
}

.modal-information__table--4col th,
.modal-information__table--4col td {
  width: 25%;
}

/** METHOD OF EXCHANGE
==============================================*/
.method-of-exchange {
  margin-top: 0.5em;
}
.method-of-exchange > dt {
  color: #fff;
  background-color: #004084;
  text-align: center;
  position: relative;
  cursor: pointer;
  font-weight: 500;
  margin-bottom: -1px;
}
.method-of-exchange > dt:before,
.method-of-exchange > dt:after {
  content: "";
  position: absolute;
}
.method-of-exchange > dt:before {
  background-color: #fff;
}
.method-of-exchange > dt:after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%3Bstroke%3A%23004084%3Bstroke-width%3A2px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M0%2C8h16%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M8%2C0v16%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 70%;
}
.method-of-exchange > dt.is-active:after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%202%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%3Bstroke%3A%23004084%3Bstroke-width%3A2px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M0%2C1h16%22%2F%3E%3C%2Fsvg%3E");
}
.method-of-exchange > dt.is-active {
  border-bottom: 1px solid #f2f2f2;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.method-of-exchange > dd,
.method-of-exchange__inner {
  background-color: #f2f2f2;
}
@media screen and (min-width: 641px) {
  .method-of-exchange > dt {
    padding: 20px;
    font-size: 16px;
    width: min(34.40702781844802vw, 470px);
    border-radius: 10px;
  }
  .method-of-exchange > dt:before,
  .method-of-exchange > dt:after {
    right: 20px;
    top: calc(50% - 10px);
    width: 20px;
    height: 20px;
  }
  .method-of-exchange > dd {
    padding: 40px 20px 20px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
  }
  .method-of-exchange__inner {
    padding: 40px 20px 20px;
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange > dt {
    padding: 15px;
    font-size: 13px;
    border-radius: 5px;
  }
  .method-of-exchange > dt:before,
  .method-of-exchange > dt:after {
    right: 15px;
    top: calc(50% - 8px);
    width: 16px;
    height: 16px;
  }
  .method-of-exchange > dd {
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 15px 20px;
  }
  .method-of-exchange__inner {
    padding: 15px 20px;
  }
}

.method-of-exchange__list {
  counter-reset: number;
}
.method-of-exchange__list > li:not(:last-child) {
  position: relative;
}
.method-of-exchange__list > li:not(:last-child):after {
  content: "";
  background-color: #6d6d6d;
  position: absolute;
  z-index: 1;
  -webkit-clip-path: polygon(0 0, 100% 0, 50% 100%);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
@media screen and (min-width: 641px) {
  .method-of-exchange__list > li:not(:last-child) {
    margin-bottom: 40px;
  }
  .method-of-exchange__list > li:not(:last-child):after {
    left: calc(50% - 30px);
    top: calc(100% + 10px);
    width: 60px;
    height: 20px;
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange__list > li:not(:last-child) {
    margin-bottom: 40px;
  }
  .method-of-exchange__list > li:not(:last-child):after {
    left: calc(50% - 30px);
    top: calc(100% + 10px);
    width: 60px;
    height: 20px;
  }
}

@media screen and (min-width: 641px) {
  .method-of-exchange__item:not(:first-child) {
    margin-top: 10px;
  }
  .method-of-exchange__item {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    align-items: flex-start;
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange__item:not(:first-child) {
    margin-top: 10px;
  }
}

.method-of-exchange__info > *:not(:first-child) {
  margin-top: 10px;
}
.method-of-exchange__item:first-of-type .method-of-exchange__info {
  position: relative;
}
.method-of-exchange__item:first-of-type .method-of-exchange__info:before {
  content: counter(number);
  counter-increment: number;
  background-color: rgb(0, 14, 136);
  color: #fff;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  line-height: 1;
  font-weight: 500;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 50%;
}
.method-of-exchange__txt {
  text-align: left !important;
}
.method-of-exchange__notes > li {
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
}
.method-of-exchange__notes > li:before {
  content: "※";
}
@media screen and (min-width: 641px) {
  .method-of-exchange__info {
    padding-left: 3em;
  }
  .method-of-exchange__info {
    width: calc(100% - min(18.301610541727673vw, 250px));
    padding-right: 30px;
  }
  .method-of-exchange__item:first-of-type .method-of-exchange__info:before {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
  .method-of-exchange__txt {
    font-size: 14px;
  }
  .method-of-exchange__notes > li {
    font-size: 12px;
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange__item:first-of-type .method-of-exchange__info {
    padding-left: 3em;
  }
  .method-of-exchange__info {
    margin-bottom: 10px;
  }
  .method-of-exchange__item:first-of-type .method-of-exchange__info:before {
    width: 25px;
    height: 25px;
    font-size: 12px;
  }
  .method-of-exchange__txt {
    font-size: 13px;
  }
  .method-of-exchange__notes > li {
    font-size: 12px;
  }
}

.method-of-exchange__img img {
  width: 100%;
}
@media screen and (min-width: 641px) {
  .method-of-exchange__img {
    width: min(18.301610541727673vw, 250px);
  }
}

.method-click {
  cursor: pointer;
  text-decoration: underline;
  color: #006fca;
}