@charset "UTF-8";

body {letter-spacing: -0.05em;}
img {width: 100%;}

.event__contents{position: relative; width: 640px;height: 100%; margin: 0 auto; padding: 100px 0;}
.step-title{padding-bottom: 40px; text-align: center; font-size: 50px;line-height: 60px;font-weight: 700;letter-spacing: -1.5px;color: #000;}
.step-title-wrap {}
.step-title-wrap .step-title span {color: #1065BA;font-weight: 700;}
.step-title-wrap .step-sub-title {padding-bottom: 40px;text-align: center;font-size: 20px;line-height: 28px;font-weight: 400;color: #000;}

.visual{height: 810px;background-image: url(../img/main-bg.png);background-size: cover;background-repeat: no-repeat;background-position: center;background-color: #f3f3f3;}
.visual .event__contents{padding: 103px 0 148px;}
.visual .content-text{width: 659px; margin: 0 auto;}
.visual ul{display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 30px; padding: 43px 40px; width: 510px; position: absolute; left: 50%; bottom: 238px; margin-left: -255px; background-color: #1065BA;}
.visual ul li {width: 50%; font-size: 20px; line-height: 24px; font-weight: 400; color: #FFF;}
.visual ul li .tag {display: inline-block; margin-right: 12px; padding: 5px 0; width: 80px; height: 34px; font-size: 20px; line-height: 24px; font-weight: 500; background-color: #FFF; color: #000; text-align: center;}

.step--01 {background-color: #f3f3f3;}
.step--01 .content-introduce {}
.step--01 .content-introduce h4 {margin-bottom: 16px; font-size: 24px; line-height: 29px; font-weight: 700; letter-spacing: -0.5px;}
.step--01 .content-introduce h4:not(:first-child) {margin: 44px 0 -14px;}
.step--01 .content-introduce ul {display: flex; flex-direction: column; gap: 10px;}
.step--01 .content-introduce ul li {font-size: 18px; line-height: 27px; font-weight: 300; letter-spacing: -0.4px;}
.step--01 .content-introduce ul li span {font-weight: 700; color: #1065BA;}
.step--01 .content-introduce dl {display: flex;}
.step--01 .content-introduce dl:not(:first-child) {margin-top: 30px;}
.step--01 .content-introduce dt {margin-right: 16px; width: 86px; height: 28px; font-size: 14px; line-height: 28px; font-weight: 500; letter-spacing: 0.3px; background-color: #1065BA; color: #FFF; text-align: center;}
.step--01 .content-introduce dd {font-size: 18px; line-height: 27px; font-weight: 400; letter-spacing: -0.4px;}
.step--01 .content-introduce dd span {display: inline-block; width: 62px;}
.step--01 .content-introduce dd li {line-height: 27px; font-weight: 400; letter-spacing: -0.4px;}

.step--02 .sold-out{position: absolute; width: 200px;height: 200px; left: 50%; top: 280px; transform:translateX(-50%);}
.step--02 .title_tab {width: calc(100% + 110px); margin: 0 -55px;}
.step--02 .title_tab_fst li {font-size: 18px; font-weight: 700; background-color: #F2F2F2;}
.step--02 .title_tab_fst li.active {background-color: #FFF;}
.step--02 .step-title {padding: 40px 0;}
.step--02 .column__introduce-area {display: none;}
.step--02 .column__introduce-area.active {display: block;}
.step--02 .event-info-wrap {margin: 0 0 40px; padding: 40px; background-color: rgba(16, 101, 186, 0.1);}
.step--02 .event-info-wrap li {font-size: 20px; line-height: 1.6; font-weight: 400; letter-spacing: -0.4px; color: #1065BA;}
.step--02 .event-info-wrap li span {display: inline-block; width: 86px; font-weight: 700;}
.step--02 .product__area{display: flex;flex-wrap: wrap; gap: 40px; margin: 0 auto 50px; width: 640px;}
.step--02 .product__img{overflow: hidden; width: 100%;height: 310px;}
.step--02 .product__item{flex: 1 1 calc(50% - 20px); max-width: 300px;}
.step--02 .product__item label{position: relative;}
.step--02 .product__item .product-desc{display: flex;flex-direction: column;align-items: center; row-gap: 8px;margin-top: 24px;}
.step--02 .product__item .product-desc span{display: inline-flex;justify-content: center;align-items: center;height: 30px;margin-bottom: 8px; padding: 0 16px; background-color: #000;border-radius: 4px; font-size: 14px;font-weight: 500; color: #fff;}
.step--02 .product__item .product-desc p{font-size: 28px;line-height: 34px;font-weight: 600;text-align: center;}
.step--02 .product__item .product-desc p.etc-text{font-size: 16px; line-height: 22px; font-weight: 500;}
.step--02 .agree__area {display: flex; justify-content: space-between; align-items: center;}
.step--02 .agree__area { margin: 50px 0 0; padding-top: 24px; border-top: 1px solid #000;}
.step--02 .agree__area .custom-control-label {font-size: 16px; line-height: 24px; color: #111;}
.step--02 .agree__area .btn {padding: 11px 20px; background-color: #8A8A8A; color: #FFF; font-weight: 500;}

.step--03 {}
.step--03 .event__contents {padding: 0 0 100px;}
.step--03 .content-introduce {display: flex; flex-direction: column;}

.step--04 {background-color: #F3F3F3;}
.step--04 .event__contents {padding: 40px 0 100px;}
.step--04 .goods-notice {}
.step--04 .goods-notice p {font-size: 18px; font-weight: 700; color: #555;}
.step--04 .goods-notice .list__area {margin-top: 16px;}
.step--04 .goods-notice .list__area li {position: relative; padding-left: 12px; font-size: 14px; line-height: 1.6; font-weight: 400; color: #555;}
.step--04 .goods-notice .list__area li:before {position: absolute; left: 0; top: 9px; display: block; content: ''; width: 4px; height: 4px; border-radius: 50%; background-color: #555;}

#my01 {}
#my01 .terms-01 {border-top: 1px solid #111;}
#my01 .terms-01 th {}
#my01 .terms-01 td {color: #888; word-break: keep-all;}