@charset "utf-8";
@import url("_template.css");
@import url("notice.css");
/* CSS Document */

/* ==========================================================================
  Gコイン購入ガイド
   ========================================================================== */
.gcoin-fv-title {
  width: 92%;
  max-width: 598px;
}

/* gcoin step */
.stepDetail{
  display: flex;
  padding: 20px 0 20px;
}

.stepDesc{
  width: 53%;
  padding-right: 1em;
}

.stepFigure{
  width: 47%;
}

.stepFigure img{
	margin: 0 auto;
}

.stepFigure a img{
	transition: transform 0.15s ease, filter 0.15s ease;
}

.stepFigure a img:hover {
  transform: scale(1.04);
  filter: brightness(1.08);
}

.stepBox{
  display: inline-block;
  margin: 0 0 8px;
  padding: 0.4em 0.5em;
  font-weight: bold;
  background: red;
  color: white;
}

.stepFigure .button {
  width: auto !important;
}

.gcoin-title{
  font-size: clamp(24px, 2.4vw, 26px);
  font-weight: bold;
}

.arrowDown{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100px;
  vertical-align: middle;
  border-top: solid 1px #462a25;
}

.arrowDown::before{
 background-image: url('data:image/svg+xml;base64,PHN2ZyAKIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIgogd2lkdGg9IjM3cHgiIGhlaWdodD0iNDZweCI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgIGZpbGw9InJnYig3MCwgNDIsIDM3KSIKIGQ9Ik0zNy4wMTUsMjcuMzk1IEwyMC4wMDAsNDQuNDEwIEwyMC4wMDAsNDUuMDAwIEwxOS40MDksNDUuMDAwIEwxOS4zOTUsNDUuMDE1IEwxOS4zODAsNDUuMDAwIEwxOC4xNzcsNDUuMDAwIEwxOC4xMzIsNDUuMDQ2IEwxOC4wODYsNDUuMDAwIEwxNy4xMDAwLDQ1LjAwMCBMMTcuMTAwMCw0NC45MTQgTDAuNDU0LDI3LjM2OCBMMS44NjgsMjUuOTU0IEwxNy4xMDAwLDQyLjA4NiBMMTcuMTAwMCwtMC4wMDAgTDIwLjAwMCwtMC4wMDAgTDIwLjAwMCw0MS41OTAgTDM1LjYwNSwyNS45ODUgTDM3LjAxNSwyNy4zOTUgWiIvPgo8L3N2Zz4=');
  width: 37px;
  height: 46px;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
}

.support .attention ul > li{
  position: relative;
  padding-left: 2rem;
}
.support .attention ul > li::before{
  content: "※";
  position: absolute;
  left: 0;
}

.support .attention ol{
  list-style-type: circle;
  padding-left: 4rem;
}

@media screen and (max-width:750px) {
	.stepDetail{
  		padding: 5% 0 7%;
	}
	
	  .stepDetail{
		display: inline;
	  }

	.stepDesc{
	  width: 100%;
	}

	.stepFigure{
	  width: 100%;
	}
  
  .stepFigure img{
    
    object-fit: fill;
    margin: 5% auto;
  }
}

/* ==========================================================================
  運営ポリシー
   ========================================================================== */

.policy-fv-title {
  width: 78%;
  max-width: 427px;
}

/* ==========================================================================
  サービス利用規約
   ========================================================================== */

.rule-fv-title {
  width: 88%;
  max-width: 558px;
}

ol.num {
    margin: 0px;
    padding: 0px;
}

ol.num li {
    position: relative;
    list-style: outside none none;
    margin-bottom: 0.1rem;
    padding-left: 45px;
}

ol.num li span {
    position: absolute;
    top: 0px;
    left: 0px;
}

/* ==========================================================================
  セキュリティ
   ========================================================================== */

.security-fv-title {
  width: 75%;
  max-width: 409px;
}

.security-btn img{
	margin: 0 auto;
}

.security-btn a img{
	transition: transform 0.15s ease, filter 0.15s ease;
}

.security-btn a img:hover {
  transform: scale(1.04);
  filter: brightness(1.08);
}

.security-bg{
	background-color: #fff5d9;
	padding: 2em 2em;
	margin: 1em 0;
}
.security-bg p{
	margin-bottom: 1em;
}
.bigText{
	font-weight: bold;
	font-size: clamp(24px, 1.6vw, 24px)
}