@import url('//webfontworld.github.io/score/SCoreDream.css');

* { border: 0; box-sizing: BORDER-BOX; margin: 0; outline: 0; padding: 0; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; }

.ui.brand::before { background-image: url('./images/brand.png'); background-position: center; background-repeat: no-repeat; background-size: cover; content: ''; display: block; height: 1em; width: 1.40625em }

A { color: #222; text-decoration: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 194, 223, .2); }
BODY { color: #222; font-family: 'SCoreDream'; font-size: 11pt; overflow-x: hidden }
H1 { font-size: 1em }
UL > LI { list-style: none; }

BODY > .background { background-image: radial-gradient(at 40% 20%, hsla(28,100%,74%,1) 0px, transparent 50%), radial-gradient(at 80% 0%, hsla(189,100%,56%,1) 0px, transparent 50%), radial-gradient(at 0% 50%, hsla(355,100%,93%,1) 0px, transparent 50%), radial-gradient(at 80% 50%, hsla(340,100%,76%,1) 0px, transparent 50%), radial-gradient(at 0% 100%, hsla(22,100%,77%,1) 0px, transparent 50%), radial-gradient(at 80% 100%, hsla(242,100%,70%,1) 0px, transparent 50%), radial-gradient(at 0% 0%, hsla(343,100%,76%,1) 0px, transparent 50%); background-size: 500% 500%; display: block; height: 100%; left: 0; position: fixed; top: 0; transition: all 1500ms ease-in-out; width: 100%; z-index: -1 }
BODY > .background { background-position: 0% 0%; }
BODY.company > .background { background-position: 100% 50%; }
BODY.business > .background { background-position: 50% 100%; }
BODY.service > .background { background-position: 100% 100%; }
BODY.support > .background { background-position: 50% 50%; }

BODY > HEADER { align-items: center; display: flex; justify-content: space-between; left: 0; padding: 2em; position: fixed; top: 0; transition: all 300ms ease-in-out; width: 100%; z-index: 50 }
BODY > HEADER > H1 { position: relative; width: 15em }
BODY > HEADER > H1 > A { display: block }
BODY > HEADER > H1 > A > .ui.brand { font-size: 3em; }
BODY > HEADER > H1 > A > DL { color: #fff; position: absolute; left: 4.5em; text-align: center; top: 50%; transform: translateY(-50%); white-space: nowrap }
BODY > HEADER > H1 > A > DL > DT { font-size: 1.66em; font-weight: 900; line-height: 1em }
BODY > HEADER > H1 > A > DL > DD { font-weight: 300; line-height: 1em; margin-top: .25em }
BODY > HEADER > NAV { }
BODY > HEADER > NAV > UL { display: flex; font-size: 1.2em; font-weight: 600; letter-spacing: -.05em; }
BODY > HEADER > NAV > UL > LI > A { color: #fff; display: block; padding: 1em }
BODY > HEADER > NAV > UL > LI > A:hover > SPAN,
BODY.company > HEADER > NAV > UL > LI > A[href="#company"] > SPAN,
BODY.business > HEADER > NAV > UL > LI > A[href="#business"] > SPAN,
BODY.service > HEADER > NAV > UL > LI > A[href="#service"] > SPAN,
BODY.support > HEADER > NAV > UL > LI > A[href="#support"] > SPAN { border-bottom: dotted 1px; }
BODY.company > HEADER > NAV > UL > LI > A[href="#company"],
BODY.business > HEADER > NAV > UL > LI > A[href="#business"],
BODY.service > HEADER > NAV > UL > LI > A[href="#service"],
BODY.support > HEADER > NAV > UL > LI > A[href="#support"] { color: #444; }
BODY > HEADER > DIV.dvSns { display: flex; gap: .5em; justify-content: flex-end; width: 15em }
BODY > HEADER > DIV.dvSns > A { color: #fff; display: block; font-size: .75em; text-align: center; }
BODY > HEADER > DIV.dvSns > A > I { font-size: 2.5em }
BODY > HEADER > DIV.dvSns > A > SPAN { display: block; margin-top: .25em }
BODY > HEADER > DIV.dvMenu { display: none; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
BODY > HEADER > DIV.dvMenu > BUTTON { appearance: none; background: none; color: #b10521; font-size: 1.2em; padding: 1.25em }

BODY > MAIN { overflow-x: hidden; word-break: keep-all; }
BODY > MAIN > A { display: block }
BODY > MAIN > SECTION { max-width: 100%; min-height: 100vh; position: relative }
BODY > MAIN > SECTION > DIV.dvInner { max-width: 1000px; margin: 0 auto; padding: 14em 2em }
BODY > MAIN > SECTION > DIV.dvInner > H2 { font-size: 3em; font-weight: 900; letter-spacing: -.05em; line-height: 1.5em; margin: .5em 0; position: relative; text-align: center }
BODY > MAIN > SECTION > DIV.dvInner > H2::before { background-image: url('./images/title-deco.png?rev=2'); background-position: center; background-repeat: no-repeat; background-size: cover; content: ''; display: block; font-size: 3em; height: 1em; left: 50%; position: absolute; top: -.5em; transform: translateX(-50%); width: 1.0629em; z-index: -1 }
BODY > MAIN > SECTION > DIV.dvInner > H3 { font-size: 1.5em; font-weight: 600; letter-spacing: -.05em; line-height: 1.5em; margin: .5em 0; text-align: center }
BODY > MAIN > SECTION > DIV.dvInner > HR { display: block; margin: 2em 0 }
BODY > MAIN > SECTION > DIV.dvInner > P { line-height: 1.5em; margin: 1em 0 }
BODY > MAIN > SECTION > DIV.dvInner > DIV.dvVisual { margin: 4em -4em }
BODY > MAIN > SECTION > DIV.dvInner > DIV.dvVisual::before { content: ''; display: block; padding-top: 28.125% }
BODY > MAIN > SECTION EM { display: block; position: absolute; z-index: -1 }
BODY > MAIN > SECTION EM::before { background-position: center; background-repeat: no-repeat; background-size: cover; content: ''; display: block; height: 1em; }
BODY > MAIN > SECTION TABLE { border-collapse: collapse; border-spacing: 0; border-top: 2px solid; margin: 4em 0; width: 100% }
BODY > MAIN > SECTION TABLE TH,
BODY > MAIN > SECTION TABLE TD { border-bottom: 1px solid rgba(0, 0, 0, .1); padding: 1em; text-align: left; }
BODY > MAIN > SECTION TABLE TH { background-color: rgba(255, 255, 255, .1); }
BODY > MAIN > SECTION P { letter-spacing: -.05em; line-height: 1.75em; margin: 1em 0 }
BODY > MAIN > SECTION P:first-child { margin-top: 0 }

BODY > MAIN > SECTION DIV.dvInner DIV.dvCards { display: flex; gap: 1em; text-align: center }
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV { background-color: rgba(255, 255, 255, .75); border-radius: 1em; border-top: solid .33em; flex-basis: 0; flex-grow: 1; padding: 2em; }
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV > STRONG { display: block; font-weight: 600; letter-spacing: -.05em; line-height: 1.75em; margin-bottom: .5em }
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV:nth-child(1) { border-color: #cc0000; }
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV:nth-child(2) { border-color: #0000cc; }
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV:nth-child(3) { border-color: #ffcc00; }
BODY > MAIN > SECTION DIV.dvInner DIV.dvCards > DIV > I { display: block; font-size: 2em; margin-bottom: .5em; }

BODY > MAIN > SECTION.scIntro {  }
BODY > MAIN > SECTION.scIntro .quegina::before { background-image: url('./images/intro/00000.png?rev=2'); width: 1.05934em }
BODY > MAIN > SECTION.scIntro .ribbon-left::before { background-image: url('./images/intro/00001.png?rev=2'); width: 1.65205em }
BODY > MAIN > SECTION.scIntro .ribbon-right::before { background-image: url('./images/intro/00003.png'); width: 1.52786em }
BODY > MAIN > SECTION.scIntro .ball-left::before { background-image: url('./images/intro/00002.png'); width: 1em }
BODY > MAIN > SECTION.scIntro .ball-right::before { background-image: url('./images/intro/00002.png'); width: 1em }
BODY > MAIN > SECTION.scIntro .phone-left::before { background-image: url('./images/intro/00005.png'); width: .96979em }
BODY > MAIN > SECTION.scIntro .phone-right::before { background-image: url('./images/intro/00004.png'); width: .76346em }

BODY > MAIN > SECTION.scIntro > .ribbon-left { font-size: 35em; left: 0; top: 10% }
BODY > MAIN > SECTION.scIntro > .ribbon-right { bottom: -10%; font-size: 25em; right: -5% }
BODY > MAIN > SECTION.scIntro > .ball-left { bottom: -15%; font-size: 25em; left: -5%; opacity: .5 }
BODY > MAIN > SECTION.scIntro > .ball-right { font-size: 15em; right: -5%; top: 10% }
BODY > MAIN > SECTION.scIntro > .phone-left { font-size: 30em; left: 5%; top: 15% }
BODY > MAIN > SECTION.scIntro > .phone-right { bottom: -10%; font-size: 40em; right: 5% }

BODY > MAIN > SECTION.scIntro > DIV.dvInner { padding: 0; position: absolute; top: 10em; left: 50%; transform: translateX(-50%) }

BODY > MAIN > SECTION.scIntro > DIV.dvInner { text-align: center }
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title { font-size: 4em; padding-top: 6em }
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title > DIV.dvQuegina { font-size: 8em; left: 50%; position: absolute; top: 10%; transform: translateX(-43%); }
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title > DIV.dvQuegina > EM { position: static }
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title > .title-back,
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title > .title-front { font-weight: 900; letter-spacing: -.05em; line-height: 1em }
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title > .title-back { color: #b10521; position: relative; z-index: -1 }
BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title > .title-front { color: #fff; font-size: 1.66em; position: relative; }

BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL { align-items: flex-start; display: flex; gap: 5em; margin: 4em 0 }
BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL > DT { flex-shrink: 0; font-size: 1.2em; font-weight: 600; letter-spacing: -.05em; line-height: 1.75em; width: 40%; }
BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL > DT > STRONG { background-color: rgba(255, 255, 255, .5); }
BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL > DD {  }
BODY > MAIN > SECTION.scCompany > DIV.dvInner > DIV.dvVisual { background-image: url('./images/company/00000.jpg'); }

BODY > MAIN > SECTION.scCompany .children::before { background-image: url('./images/company/00001.png'); width: 1.68351em }
BODY > MAIN > SECTION.scCompany .technology::before { background-image: url('./images/company/00002.png'); width: .57657em }

BODY > MAIN > SECTION.scCompany .children { font-size: 22em; left: 0; top: 45% }
BODY > MAIN > SECTION.scCompany .technology { font-size: 25em; right: 0; top: 15% }

BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore { display: flex; margin: 4em 0 }
BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV { align-items: center; border: .25em solid; border-radius: 50em; color: #fff; display: flex; flex-basis: 0; flex-grow: 1; padding: 1em 3em; text-align: center }
BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV > SPAN { display: block; flex-grow: 1; font-weight: 600; letter-spacing: -.05em; line-height: 1.75em; }
BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV.dvQuegina { border: 0; flex-grow: 0; margin: 0 -3em; padding: 0; position: relative; z-index: 1 }
BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV.dvQuegina > I { font-size: 5em; }

BODY > MAIN > SECTION.scBusiness .dad::before { background-image: url('./images/business/00000.png'); width: .60748em }
BODY > MAIN > SECTION.scBusiness .child::before { background-image: url('./images/business/00001.png'); width: .68175em }
BODY > MAIN > SECTION.scBusiness .ball-blur::before { background-image: url('./images/business/00002.png'); width: .99405em }
BODY > MAIN > SECTION.scBusiness .ball::before { background-image: url('./images/business/00003.png'); width: 1.02084em }
BODY > MAIN > SECTION.scBusiness .chart::before { background-image: url('./images/business/00004.png'); width: .81416em }

BODY > MAIN > SECTION.scBusiness .dad { font-size: 38em; left: 0; top: 20% }
BODY > MAIN > SECTION.scBusiness .child { bottom: 5%; font-size: 28em; right: -5%; }
BODY > MAIN > SECTION.scBusiness .ball-blur { font-size: 10em; right: -2%; top: 15% }
BODY > MAIN > SECTION.scBusiness .ball { font-size: 3em; right: 20%; top: 15% }
BODY > MAIN > SECTION.scBusiness .chart { bottom: 5%; font-size: 22em; right: 0 }

BODY > MAIN > SECTION.scService .bear::before { background-image: url('./images/service/00000.png?rev=2'); width: .69477em }
BODY > MAIN > SECTION.scService .balloon::before { background-image: url('./images/service/00001.png?rev=2'); width: 1.1823em }
BODY > MAIN > SECTION.scService .phone-back::before { background-image: url('./images/service/00003.png?rev=2'); width: .63086em }
BODY > MAIN > SECTION.scService .phone-front::before { background-image: url('./images/service/00002.png?rev=2'); width: .6292em }

BODY > MAIN > SECTION.scService .bear { font-size: 25em; left: 5%; top: 1.4em }
BODY > MAIN > SECTION.scService .balloon { font-size: 8em; left: 50%; margin-left: 24rem; top: 30% }
BODY > MAIN > SECTION.scService .phone-back { font-size: 30em; left: 50%; top: .95em }
BODY > MAIN > SECTION.scService .phone-front { font-size: 35em; left: 50%; margin-left: 10rem; top: .7em }

BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvFeatures { color: #fff; padding: 20em 0 0 5em; text-align: right; width: 50% }
BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvFeatures > H3 { font-size: 1.5em; }
BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvFeatures > HR { background-color: #fff; display: inline-block; height: 1px; margin: 2em 0 0; width: 5em; }
BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvFeatures > UL { margin-top: 2em }
BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvFeatures > UL > LI { margin: .5em 0 }
BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvCards { margin-top: 6em }

BODY > MAIN > SECTION.scSupport > DIV.dvInner > FORM INPUT[type="text"],
BODY > MAIN > SECTION.scSupport > DIV.dvInner > FORM TEXTAREA { appearance: none; background: rgba(255, 255, 255, .1); display: block; line-height: 1.5em; padding: 1em; width: 100% }
BODY > MAIN > SECTION.scSupport > DIV.dvInner > FORM TEXTAREA { height: 10em; }
BODY > MAIN > SECTION.scSupport > DIV.dvInner > FORM > DIV.dvControls { display: flex; justify-content: center; }
BODY > MAIN > SECTION.scSupport > DIV.dvInner > FORM > DIV.dvControls > BUTTON { appearance: none; background: #fff; border-radius: 10em; cursor: pointer; display: block; font-size: 1.2em;  font-weight: 600; padding: 1em 2em }

BODY.scrolled > HEADER { background-color: rgba(255, 255, 255, .95); box-shadow: 0 .5em 1em rgba(0, 0, 0, .1); font-size: .9em; padding: .5em 2em }
BODY.scrolled > HEADER > H1 > A > DL,
BODY.scrolled > HEADER > NAV > UL > LI > A > SPAN,
BODY.scrolled > HEADER > DIV.dvSns > A { color: #222; }
BODY.scrolled.company > HEADER > NAV > UL > LI > A[href="#company"] > SPAN,
BODY.scrolled.business > HEADER > NAV > UL > LI > A[href="#business"] > SPAN,
BODY.scrolled.service > HEADER > NAV > UL > LI > A[href="#service"] > SPAN,
BODY.scrolled.support > HEADER > NAV > UL > LI > A[href="#support"] > SPAN { color: #b10521; }

@media screen and (max-width: 1000px) {
    BODY > HEADER { background-color: rgba(255, 255, 255, .95); box-shadow: 0 .5em 1em rgba(0, 0, 0, .1); color: #222; display: block; padding: 1em }
    BODY.scrolled > HEADER { padding: 1em }
    BODY > HEADER > H1 { width: 10em }
    BODY > HEADER > H1 > A > .ui.brand { font-size: 2.5em }
    BODY > HEADER > H1 > A > DL { color: #222; font-size: .9em }
    BODY > HEADER > NAV { background-color: #fff; display: none; left: 0; margin-top: 1em; position: absolute; width: 100% }
    BODY > HEADER > NAV > UL { display: block }
    BODY > HEADER > NAV > UL > LI { border-top: 1px solid #eee }
    BODY > HEADER > NAV > UL > LI > A { color: #222 }
    BODY > HEADER > DIV.dvSns { position: absolute; right: 5em; top: 50%; transform: translateY(-50%) }
    BODY > HEADER > DIV.dvSns > A { color: #222 }
    BODY > HEADER > DIV.dvSns > A > I { font-size: 2em }
    BODY > HEADER > DIV.dvSns > A > SPAN { display: none }
    BODY > HEADER > DIV.dvMenu { display: block }
    BODY > HEADER > NAV.open { display: block }

    BODY > MAIN > SECTION > DIV.dvInner DIV.dvCards { display: grid; grid-template-columns: 1fr 1fr; gap: 1em }
    
    BODY > MAIN > SECTION > DIV.dvInner { max-width: none; padding: 8em 2em; width: 100%; }
    BODY > MAIN > SECTION > DIV.dvInner > H2 { font-size: 2em }
    BODY > MAIN > SECTION > DIV.dvInner > H3 { font-size: 1.2em }
    BODY > MAIN > SECTION.scIntro > DIV.dvInner > .title { font-size: 3em }
    BODY > MAIN > SECTION.scIntro > .ribbon-left { font-size: 15em }
    BODY > MAIN > SECTION.scIntro > .ribbon-right { bottom: 10%; font-size: 12em }
    BODY > MAIN > SECTION.scIntro > .ball-left { bottom: 10%; font-size: 8em; }
    BODY > MAIN > SECTION.scIntro > .ball-right { font-size: 8em; right: -10% }
    BODY > MAIN > SECTION.scIntro > .phone-left { font-size: 10em; left: -2% }
    BODY > MAIN > SECTION.scIntro > .phone-right { bottom: 5%; font-size: 20em; right: -15%}

    BODY > MAIN > SECTION.scCompany .technology { font-size: 12em }
    BODY > MAIN > SECTION.scCompany .children { display: none }
    BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL { display: block }
    BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL > DT { width: 100% }
    BODY > MAIN > SECTION.scCompany > DIV.dvInner > DL > DD { margin-top: 2em }

    BODY > MAIN > SECTION.scBusiness { padding-bottom: 20em }
    BODY > MAIN > SECTION.scBusiness .dad { font-size: 15em; top: 0 }
    BODY > MAIN > SECTION.scBusiness .ball-blur { font-size: 5em; top: 10% }
    BODY > MAIN > SECTION.scBusiness .ball { font-size: 2em; top: 5% }
    BODY > MAIN > SECTION.scBusiness .chart { bottom: 5%; font-size: 20em }
    BODY > MAIN > SECTION.scBusiness .child { bottom: 5%; font-size: 14em }
    BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore { align-items: center; flex-direction: column; }
    BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV { padding: 2em }
    BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV.dvQuegina { margin: -1em 0 }
    BODY > MAIN > SECTION.scBusiness > DIV.dvInner > DIV.dvValue > DIV.dvCore > DIV.dvQuegina > I { font-size: 3em }

    BODY > MAIN > SECTION.scService { padding-bottom: 20em }
    BODY > MAIN > SECTION.scService .bear { bottom: 8rem; font-size: 14em; left: 50%; margin-left: -.33em; top: auto }
    BODY > MAIN > SECTION.scService .phone-back { bottom: 8rem; font-size: 16em; left: -5%; top: auto; }
    BODY > MAIN > SECTION.scService .phone-front { bottom: 8rem; font-size: 24em; left: inherit; right: -20%; top: auto }
    BODY > MAIN > SECTION.scService > DIV.dvInner > DIV.dvFeatures { margin: 4em 0; padding: 0; text-align: center; width: 100% }
    BODY > MAIN > SECTION.scService > DIV.dvInner DIV.dvCards { display: grid; grid-template-columns: 1fr; gap: 1em }
    
    BODY > MAIN > SECTION.scSupport { padding-bottom: 8em }
    BODY > MAIN > SECTION.scSupport TABLE,
    BODY > MAIN > SECTION.scSupport TABLE TBODY,
    BODY > MAIN > SECTION.scSupport TABLE TH,
    BODY > MAIN > SECTION.scSupport TABLE TD { display: block; width: 100% }
    BODY > MAIN > SECTION.scSupport TABLE TH { background: none }
    BODY > MAIN > SECTION.scSupport TABLE TD { padding: 0 }
    BODY > MAIN > SECTION.scSupport LABEL { display: block; padding: 1em }
}