@charset "utf-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/* helper */
.mb-45 {margin-bottom: 2.25rem; }
.pb-6 {padding-bottom: 4.5rem;}
.d-ib {display: inline-block !important; }
.btn-tp1 {background: #2C44A5; color: #fff;  }
.btn-tp2 {background: #5441BB; color: #fff;  }
.btn-tp1:hover {background: #203798; color: #fff;  }
.btn-tp2:hover {background: #3b2998; color: #fff;  }

body {background: url(https://static.ncsoft.jp/images/event/aionclassic/landing/2209/bg.jpg) center top no-repeat #fff; font-family: "Noto Sans JP", sans-serif; font-feature-settings: "palt";letter-spacing: 0.05em;}
.btn-black {color: #fff; background: #000; }
.btn-black:hover {color: #ffc}

.allContainer {width: 100%; overflow: hidden; }
.part__inner {position: relative; margin: auto; max-width: 1170px; padding: 0 2rem; }

@media screen and (max-width: 767.98px) {
    body {
        background-image: url(https://static.ncsoft.jp/images/event/aionclassic/landing/2209/bg_m.jpg); background-size: 100%;
    }
}



/* --------------
    headArea
------------------ */
.headArea__inner {display: flex; /* justify-content: flex-end; */ } 
.headArea__content {width: 620px; max-width: 100% ;}
.headArea__logo {position: absolute; top: 20px; left: 40px; width:268px; height: 0; }
.headArea__logo::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; padding-top: 20.895522%; background: url(https://static.ncsoft.jp/images/event/aionclassic/landing/2209/logo.png); background-size: contain; filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.25));}

.headArea__movie {position: relative; width: 620px; max-width: 100%; }
.headArea__movieLink {display: block; width: 100%; padding-top: 55.806451%; height: 0; }
.headArea__movieLink img {position: absolute; left: 0; top: 0; width: 100%; height: auto; }
.headArea__movieLink::after {content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);width: 22.258064%; aspect-ratio: 1 / 1; background: url(https://static.ncsoft.jp/images/event/aionclassic/landing/2209/play.png); background-size: contain; transition: filter .3s ease-in-out; }
.headArea__movieLink:hover::after {filter: brightness(180%);}
.headArea .lead {font-family: 'Noto Serif JP', serif; font-weight: 600; font-size: 1.3rem; }
.headArea h1 {margin-top: 10px; margin-bottom: -140px; margin-left: -90px; margin-right: -90px; }
.headArea .btn {padding: .75rem .5rem; box-shadow: 0 3px 2px rgba(0,0,0,.3); font-weight: bold; font-size: 18px;}

@media screen and (max-width: 767.98px) {
    .headArea__content {padding-top: 38vw}
    .headArea h1 {margin-bottom: -20vw; margin-left: -18vw; margin-right: -18vw; }
    .headArea .lead {text-align: center; font-size: 1rem; }
}

@media screen and (max-width:991.98px) {
    .headArea__logo {width: 27.33333%; top: 3vw; left: 3vw; }
}



/* --------------
    part1
------------------ */
.part1 {margin-top: 110px; }
.part1 h2 {position: relative; font-family: "Noto Serif JP", serif; font-weight: bold; text-align: center; font-size: 2.5rem; margin-bottom: 1em; }
.part1 h2::before {content: ""; position: absolute; left: 50%; top: 0; transform: translate(-50%, -100%); width: 90px; height: 36px; background: url(https://static.ncsoft.jp/images/event/aionclassic/landing/2209/deco.png); background-size: contain; }
.eventList h3 {font-size: 1.1rem; font-weight: bold; margin-top: .5rem;}
.eventList p {margin-bottom: .5rem; }
.eventList .btn {box-shadow: 0 3px 2px rgba(0,0,0,.2)}
.eventList a {text-decoration: none; color: inherit; transition: transform .1s ease-in-out;}
.eventList a:hover {transform: scale(1.05); }

@media screen and (max-width: 575.98px) {
    .part1 {margin-top: 20vw; }
    .part1 h2 {font-size: 1.25rem; }
    .part1 h2::before {width: 45px; height: 18px; }
}



/* --------------
    partStep
------------------ */
.partStep {background: #F1EEF9; }
.stepItem {display: flex; align-items: center; background: #fff; border-radius: .5rem; border: 1px solid #ccc; box-shadow: 0 0 .5rem rgba(0,0,0,.3); line-height: 1.4; text-decoration: none; color: inherit; transition: transform .1s ease-in-out; }
.stepItem::after {content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjE0IiB2aWV3Qm94PSIwIDAgOCAxNCI+DQogIDxwYXRoIGlkPSJfX3ciIGRhdGEtbmFtZT0iJmd0O193IiBkPSJNNy0xbDcsOEgwWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNykgcm90YXRlKDkwKSIvPg0KPC9zdmc+DQo=); padding: .5rem; }
.stepItem:hover {transform: scale(1.02); color: inherit; }

.stepItem__title {align-self: stretch; display: flex; justify-content: center; align-items: center; padding: 0.5rem; background: #ccc; color: #fff; font-family: "Noto Serif JP"; font-weight: bold; writing-mode: tb-rl; font-size: 1.5rem; letter-spacing: .5rem; border-radius: .5rem 0 0 .5rem;  }
.stepItem__body {padding: .5rem 1rem; flex-grow: 1; }
.stepItem__title1 {font-size: 1.5rem; font-weight: bold;  }
.stepItem__title2 {font-weight: bold; font-size: 1.125rem; margin-bottom: .25rem;  }

.stepItem--1 .stepItem__title {background-color: #6547FF;}
.stepItem--2 .stepItem__title {background-color: #B532FF;}
.stepItem--3 .stepItem__title {background-color: #FF9C47;}

.stepItem--1 .stepItem__title1 {color: #6547FF;}
.stepItem--2 .stepItem__title1 {color: #B532FF;}
.stepItem--3 .stepItem__title1 {color: #FF9C47;}



