@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;700&display=swap);
@import url(https://fonts.googleapis.com/earlyaccess/hannari.css);

@font-face {
    font-family: xYuGothic;
    font-style: normal;
    font-weight: 400;
    src: local("YuGothic-Medium"), local("Yu Gothic Medium"), local("YuGo-Medium"), local("YuGothic Medium"), local("YuGothic-Regular"), local("Yu Gothic")
}

@font-face {
    font-family: xYuGothic;
    font-style: normal;
    font-weight: 700;
    src: local("YuGothic-Bold"), local("Yu Gothic Bold"), local("YuGo-Bold"), local("YuGothic Bold"), local("Yu Gothic")
}

@font-face {
    font-family: xYuMincho;
    font-style: normal;
    font-weight: 400;
    src: local("YuMincho-Regular"), local("Yu Mincho Regular"), local("YuMin-Medium"), local("YuMincho Medium"), local("Yu Mincho")
}

@font-face {
    font-family: xYuMincho;
    font-style: normal;
    font-weight: 600;
    src: local("YuMincho-Demibold"), local("Yu Mincho Demibold"), local("YuMin-Demibold"), local("YuMincho Demibold"), local("Yu Mincho")
}

@font-face {
    font-family: "Academy Engraved LET Plain:1.0";
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/AcademyEngravedLetPlain.woff) format("woff")
}

@font-face {
    font-family: icon;
    font-style: normal;
    font-weight: 400;
    src: url("data:application/font-woff;base64,d09GRgABAAAAAAWoAAsAAAAACawAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAAIEAAAC+Ijsm709TLzIAAAGMAAAAPwAAAGBLBzeMY21hcAAAAcwAAADwAAACxpimM65nbHlmAAACvAAAAMsAAAFYwLQ99mhlYWQAAAOIAAAALAAAADYaMq+raGhlYQAAA7QAAAAWAAAAJAEBAJhobXR4AAADzAAAABAAAABcAwAAAGxvY2EAAAPcAAAAGAAAADAGUgakbWF4cAAAA/QAAAAeAAAAIAEjAB5uYW1lAAAEFAAAASkAAAIWm5e+CnBvc3QAAAVAAAAAZwAAAJCbKVUaeJxNjcEKwkAMRF/rdrtarbWtHjz5CX6BJxEPHsV7QRChePL/6WxswYQhGWYyIQEWHDmRni+3O2XffT/scfwq6v970r9fHWFi0pzNIDzx1Bws7crD1IjAXD/i5slo2bIzvyMVlqzUkc3EyzHTsaYaXZlQ01CIeXJlFXa1GQBEgwhtAAAAeJxjYGFQZJzAwMrAwBDIEAkkBaG0LQMbgyIDAxMDKzMDVhCQ5prCcIAh8QErQwOQy83QDRZmRFHECgBbfwcQAHiczdJLTsMwEMbxv5ukSekjD5oIsWDVJZdC4lUJlapQdcOBWHEm36R8E8+iF0BirF8kj5J4bA9QAJncSw7hh4DFt7JhzGdcjfmcL80bDXv/gS1v7DlyisX5PGYeldlxUIYxcxlh/PJW446NBsxoqZXrGVizZE7HSmuVVCy4ZqJ1ctU3tTrClL+PGbR10w9rrJxOxZSVVfJfYmGPcOOzATvzRJXr9JNWnlwtz66RF9fLq7P/bJ12rjtMlrJzc3l3nezdSg5OXcKHK+XTVXJ0toOT07lGEt01MSTWXXGSWEfGLLFOjXminiAWCeEXw/cqBHicXY45DsIwEEXHM46NhNiEiYtIRKSIOyKRgEs4Bx25ABUpoPHRmdiIIra8FP+/NyBgXE8YYA7grdfWaae9s7flwZjDclEZUw2lLApZxpvTGDuBN4EGOO/as3behm0/60MIL34gcT/wgA1zjaoaoVVVd1dxOZUif8sMmwYziS0qPjVmdDyS5D9Ry4LUfzBh7J9ysxI2j5jIuMc80i8/xcHf38Oa+90o9Ze9WImIUCk/Q0r5hCPU9NNP/HFwV0fMOIqazKum/i/GeyCRAHicY2BkYGAAYgmzh5nx/DZfGbgZGoAiDHe9LK4j00BRkDgHAxOIAwATSwk7eJxjYGRgYGhgYEAiGRlQgTgAJe8BmgAAeJxjYACCBhyYQgAA51wDAXicY2AAAikGHQYfhhyGHoY1hCAA/BoM93icY2BkYGAQZxBiYGIAARDJBYQMDP/BfAYADKcBQgAAeJxlkD1uwkAUhMdgSAJSghQpKbNVCiKZn5IDQE9Bl8KYtTGyvdZ6QaLLCXKEHCGniHKCHChj82hgLT9/M2/e7soABviFh3p5uG1qvVq4oTpxm/Qg7JOfhTvo40W4S38o3MMbpsJ9POKdO3j+HZ0BSuEW7vEh3Kb/KeyTv4Q7eMK3cJf+j3APK/wJ9/HqDdPIFLEp3FIn+yy0Z3n+rrStUlOoSTA+WwtdaBs6vVHro6oOydS5WMXW5GrOrs4yo0prdjpywda5cjYaxeIHkcmRIoJBgbipDktoJNgjQwh71b3UK6YtKvq1VpggwPgqtWCqaJIhlcaGyTWOrBUOPG1K1zGt+FrO5KS5zGreJCMr/u+6t6MT0Q+wbaZKzDDiE1/kg+YO+T89EV6oAAAAeJxtwckOgjAUQNF36wNxABUH/D0SpiZNIaUNv++CreeIkR3yX4PhgJKRc6TgxJkLV0oqbtx5UPPkxZsPDV/RNbZBfXLOpEVdP0Tt5s1nwY5TZCXSEvAkHAs9Ax0zG5aRSeQHz+sSJQA=") format("woff")
}

.Icon {
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    font-family: icon;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    position: relative;
    text-transform: none;
    top: -.1em;
    vertical-align: middle
}

.Icon:before {
    font-family: inherit;
    font-style: inherit;
    font-variant: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-transform: inherit;
    vertical-align: inherit
}

.Icon.-star:before {
    content: "\e005"
}

.Icon.-null:before {
    content: "\e000"
}

.Icon.-up:before {
    content: "\e001"
}

.Icon.-left:before {
    content: "\e002"
}

.Icon.-down:before {
    content: "\e003"
}

.Icon.-right:before {
    content: "\e004"
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
    background-color: #fff;
    font-family: Noto Sans CJK JP, Noto Sans, Source Han Sans JP, Noto Sans Japanese, Noto Sans JP, Hiragino Kaku Gothic ProN, Hiragino Kaku Gothic Pro, xYuGothic, Meiryo, sans-serif;
    font-size: 16px;
    line-height: 1.6
}

body,
html {
    height: 100%
}

body {
    margin: 0
}

button,
input,
optgroup,
select,
textarea {
    font: inherit;
    font-size: 100%;
    margin: 0
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=email],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=url] {
    background-image: linear-gradient(#fff, #fff)
}

button:focus {
    outline: none
}

button:focus-visible:focus {
    outline: unset
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

.-onlyLargeScreen,
.-onlySmallScreen {
    display: none !important
}

.Drawer {
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 301;
}

.Drawer:before {
    background: linear-gradient(90deg, #e2f5ff, #e6e1f1);
    border-radius: 50%;
    content: "";
    display: block;
    height: 186px;
    position: absolute;
    right: -43px;
    top: -55px;
    width: 186px;
    z-index: 1
}

.Drawer .Drawer__Button {
    align-items: center;
    background: transparent;
    background: rgba(255, 255, 255, 0);
    border: 0;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    height: 60px;
    justify-content: center;
    margin: auto;
    padding: 0;
    pointer-events: all;
    position: absolute;
    right: 46px;
    top: 48px;
    transition: background .3s;
    width: 60px;
    z-index: 1
}

.Drawer .Drawer__Button:focus {
    box-shadow: none;
    outline: 0
}

.Drawer .Drawer__Button:focus:focus-visible {
    box-shadow: 0 0 0 .2rem #fff, 0 0 0 .35rem #069
}

.Drawer .Drawer__ButtonIcon {
    color: #0071bc;
    display: block;
    left: 0;
    margin: auto;
    right: 0;
    top: calc(50% - 2.5px)
}

.Drawer .Drawer__ButtonIcon,
.Drawer .Drawer__ButtonIcon:after,
.Drawer .Drawer__ButtonIcon:before {
    background-color: currentColor;
    border-radius: 0;
    height: 5px;
    position: absolute;
    transition-duration: .15s;
    transition-property: transform, color;
    transition-timing-function: ease;
    width: 38px
}

.Drawer .Drawer__ButtonIcon:after,
.Drawer .Drawer__ButtonIcon:before {
    content: "";
    display: block
}

.Drawer .Drawer__ButtonIcon:before {
    top: -14px
}

.Drawer .Drawer__ButtonIcon:after {
    bottom: -14px
}

.Drawer .Drawer__ButtonIcon {
    transition-duration: .2s;
    transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}

.Drawer .Drawer__ButtonIcon:before {
    transition: top .1s ease-in .2s, opacity .1s ease-in
}

.Drawer .Drawer__ButtonIcon:after {
    transition: bottom .1s ease-in .2s, transform .2s cubic-bezier(.55, .055, .675, .19)
}

.Drawer__Button[aria-expanded=true] .Drawer__ButtonIcon {
    color: #0071bc;
    transform: rotate(225deg) translateZ(0);
    transition-delay: .12s;
    transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

.Drawer__Button[aria-expanded=true] .Drawer__ButtonIcon:before {
    opacity: 0;
    top: 0;
    transition: top .1s ease-out, opacity .1s ease-out .12s
}

.Drawer__Button[aria-expanded=true] .Drawer__ButtonIcon:after {
    bottom: 0;
    transform: rotate(-90deg);
    transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s
}

.Drawer .Drawer__Button:before {
    background: url(../img/Drawer/bg_01.svg) 0 0/100% 100%;
    content: "";
    display: block;
    height: 12px;
    left: -10px;
    margin: auto;
    position: absolute;
    right: -10px;
    top: -10px;
    width: 56px
}

.Drawer .Drawer__Panel {
    bottom: 0;
    display: none;
    justify-content: flex-end;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    right: 0;
    top: 0
}

.-ready.Drawer .Drawer__Panel {
    display: flex
}

.-panelOpen.Drawer .Drawer__Panel {
    pointer-events: all
}

.Drawer .Drawer__PanelInner {
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff 258px);
    bottom: 0;
    box-sizing: border-box;
    max-width: 770px;
    overflow: auto;
    padding: 160px 0 60px 344px;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateX(100%);
    transition: transform .4s;
    width: 100%
}

.-panelOpen.Drawer .Drawer__PanelInner {
    transform: translateX(0)
}

.Drawer .Drawer__Nav {
    color: #bdccd4;
    font-family: "Academy Engraved LET Plain:1.0";
    font-size: 52px;
    letter-spacing: .05em;
    line-height: 1;
    list-style: none;
    margin: 0;
    padding: 0
}

.Drawer .Drawer__Nav li {
    align-items: center;
    display: flex;
    padding-left: 80px;
    position: relative
}

.Drawer .Drawer__Nav li:nth-child(n+2) {
    margin-top: 40px
}

.Drawer .Drawer__Nav li:before {
    background: url(../img/Drawer/bg_02.svg) no-repeat 0 0/100% 100%;
    content: "";
    display: block;
    height: 32px;
    left: 0;
    position: absolute;
    top: calc(50% - 16px);
    width: 70px
}

.Drawer .Drawer__Nav li:nth-child(n+2):before {
    background-image: url(../img/Drawer/bg_04.svg)
}

.Drawer .Drawer__Nav a {
    align-items: center;
    color: #0071bc;
    display: inherit;
    text-decoration: none
}

.Drawer .Drawer__Nav a:before {
    background: url(../img/Drawer/bg_03.svg) no-repeat 0 0/100% 100%;
    content: "";
    display: block;
    height: 32px;
    left: 0;
    position: absolute;
    top: calc(50% - 16px);
    width: 70px
}

.Drawer .Drawer__Nav li:nth-child(n+2) a:before {
    background-image: url(../img/Drawer/bg_05.svg)
}

.Drawer .Drawer__NavItemLabelSub {
    align-self: flex-end;
    font-family: xYuMincho, "Noto Serif JP", HiraMinProN-W3, Hiragino Mincho Pro, HG正楷書体-PRO, ＤＦ中楷書体, ＭＳ 明朝, MS Mincho, serif;
    font-size: 14px;
    margin-left: 6px;
    position: relative;
    top: -.3em
}

.Hero img {
    display: block;
    height: auto;
    width: 100%
}
.Hero, .mainlogo, .Intro, body, html{
    background: #faf9f0;
}

.Intro {
    color: #0071bc;
    font-family: Hannari, xYuMincho, "Noto Serif JP", HiraMinProN-W3, Hiragino Mincho Pro, HG正楷書体-PRO, ＤＦ中楷書体, ＭＳ 明朝, MS Mincho, serif;
    font-size: 28px;
    line-height: 1.8;
    padding: 40px 20px;
    text-align: center
}

.Intro:after,
.Intro:before {
    background: 0 0/100% 100%;
    content: "";
    display: block;
    height: 50px;
    margin: 0 auto;
    width: 330px
}

.Intro:before {
    background-image: url(../img/Intro/bg_01.svg)
}

.Intro:after {
    background-image: url(../img/Intro/bg_02.svg)
}

.Section {
    background: #faf9f0;
    padding: 100px 20px
}

.Section.-even {
    background: #fff
}

.Section .Section__Inner {
    margin: 0 auto;
    max-width: 1000px;
    position: relative;
    z-index: 1
}

.ColumnLayout {
    display: flex;
    flex-wrap: wrap;
    margin-top: -50px
}

.Twitter {
    color: #0071bc
}

.Twitter .Twitter__Title {
    align-items: center;
    color: #0071bc;
    display: flex;
    font-family: "Academy Engraved LET Plain:1.0";
    font-size: 54px;
    font-weight: 400;
    justify-content: center;
    line-height: 1;
    margin: 0 0 20px;
    position: relative;
    text-align: center
}

.Twitter .Twitter__Title:after,
.Twitter .Twitter__Title:before {
    background: 0 0/100% 100%;
    content: "";
    display: block;
    height: 50px;
    margin: 0 .1em;
    width: 120px
}

.Twitter .Twitter__Title:before {
    background-image: url(../img/Twitter/bg_01.svg)
}

.Twitter .Twitter__Title:after {
    background-image: url(../img/Twitter/bg_02.svg)
}

.Twitter .Twitter__Body {
    background: url(../img/Twitter/bg_03.svg) no-repeat 0 100%, linear-gradient(90deg, #e2f5ff, #e6e1f1);
    border: 2px solid;
    box-shadow: 0 0 0 5px #fff, 0 0 0 7px currentColor;
    padding: 22px 16px 58px
}

.Twitter .Twitter__BodyInner {
    height: 270px;
    overflow: auto
}

.News {
    color: #0071bc
}

.News .News__Title {
    align-items: center;
    color: #0071bc;
    display: flex;
    font-family: "Academy Engraved LET Plain:1.0";
    font-size: 54px;
    font-weight: 400;
    justify-content: center;
    line-height: 1;
    margin: 0 0 20px;
    position: relative;
    text-align: center
}

.News .News__Title:after,
.News .News__Title:before {
    background: 0 0/100% 100%;
    content: "";
    display: block;
    height: 50px;
    width: 120px
}

.News .News__Title:before {
    background-image: url(../img/News/bg_01.svg)
}

.News .News__Title:after {
    background-image: url(../img/News/bg_02.svg)
}

.News .News__Body {
    background: url(../img/News/bg_03.svg) no-repeat 100% 100%, linear-gradient(90deg, #e2f5ff, #e6e1f1);
    border: 2px solid;
    box-shadow: 0 0 0 5px #fff, 0 0 0 7px currentColor;
    padding: 22px 30px 58px
}

.News .News__BodyInner {
    font-family: xYuMincho, "Noto Serif JP", HiraMinProN-W3, Hiragino Mincho Pro, HG正楷書体-PRO, ＤＦ中楷書体, ＭＳ 明朝, MS Mincho, serif;
    height: 270px;
    overflow: auto
}

.News .News__NewsList {
    list-style: none;
    margin: 0;
    padding: 0
}

.News .News__NewsItemDate {
    font-size: 14px
}

.News .News__NewsItemText {
    font-size: 16px
}

.SectionContent {
    border: 2px solid #0071bc;
    color: #0071bc;
    font-family: xYuMincho, "Noto Serif JP", HiraMinProN-W3, Hiragino Mincho Pro, HG正楷書体-PRO, ＤＦ中楷書体, ＭＳ 明朝, MS Mincho, serif;
    font-size: 16px;
    padding: 50px 90px 115px;
    position: relative;
    z-index: 1
}

.SectionContent:before {
    background: linear-gradient(90deg, #e2f5ff, #e6e1f1);
    border: 2px solid #0071bc;
    bottom: 8px;
    left: 8px;
    right: 8px;
    top: 8px;
    z-index: -1
}

.SectionContent:after,
.SectionContent:before {
    content: "";
    display: block;
    pointer-events: none;
    position: absolute
}

.SectionContent:after {
    background: url(../img/SectionContent/bg_01.svg) no-repeat 50% 0, url(../img/SectionContent/bg_02.svg) no-repeat 50% 100%, url(../img/SectionContent/bg_03.svg) no-repeat 0 0, url(../img/SectionContent/bg_04.svg) no-repeat 100% 0, url(../img/SectionContent/bg_05.svg) no-repeat 100% 100%, url(../img/SectionContent/bg_06.svg) no-repeat 0 100%;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0
}

.SectionContent p {
    margin: 1.2em 0 0
}

.SectionContent .SectionContent__Title {
    margin: 0 0 60px
}

.SectionContent .SectionContent__TitleEn {
    display: block;
    font-family: "Academy Engraved LET Plain:1.0";
    font-size: 86px;
    font-weight: 400;
    line-height: 1;
    text-align: center
}

.SectionContent .SectionContent__TitleJa {
    align-items: center;
    display: flex;
    font-family: xYuMincho, "Noto Serif JP", HiraMinProN-W3, Hiragino Mincho Pro, HG正楷書体-PRO, ＤＦ中楷書体, ＭＳ 明朝, MS Mincho, serif;
    font-size: 23px;
    justify-content: center;
    letter-spacing: .1em
}

.SectionContent .SectionContent__TitleJa:after,
.SectionContent .SectionContent__TitleJa:before {
    content: "";
    height: 1px;
    width: 60px
}

.SectionContent .SectionContent__TitleJa:before {
    background: linear-gradient(90deg, rgba(0, 113, 188, 0), #0071bc);
    margin-right: .3em
}

.SectionContent .SectionContent__TitleJa:after {
    background: linear-gradient(90deg, #0071bc, rgba(0, 113, 188, 0));
    margin-left: .2em
}

.SectionContent .SectionContent__Heading {
    border-bottom: 2px solid;
    font-size: 20px;
    font-weight: 400;
    margin: 40px 0 20px
}

.SectionContent .SectionContent__Heading:before {
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e005";
    display: inline-block;
    font-family: icon;
    font-size: 150%;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    position: relative;
    text-transform: none;
    top: -.1em;
    vertical-align: middle
}

.SectionContent .SectionContent__Heading2 {
    font-size: 20px;
    margin: 40px 0 20px
}

.SectionContent .SectionContent__Heading2:before {
    content: "";
    display: table;
    height: 0;
    margin-bottom: -.3em;
    width: 100%
}

.SectionContent .SectionContent__Heading2:after {
    content: "";
    display: table;
    height: 0;
    margin-top: -.3em;
    width: 100%
}

.SectionContent .SectionContent__Heading2+p {
    margin-top: 0
}

.Separator {
    height: 1280px;
    margin: -640px 0;
    overflow: hidden;
    pointer-events: none;
    position: relative
}

.Separator:before {
    background: url(../img/Separator/bg_01.svg) 0 0/100% 100%;
    height: 148px;
    left: calc(50% - 23px);
    top: 566px;
    width: 46px
}

.Separator:after,
.Separator:before {
    content: "";
    display: block;
    position: absolute
}

.Separator2 {
    height: 1280px;
    margin: -640px 0;
    overflow: hidden;
    pointer-events: none;
    position: relative
}

.Separator2:before {
    background: url(../img/Separator/bg_01.svg) 0 0/100% 100%;
    height: 148px;
    left: calc(50% - 23px);
    top: 566px;
    width: 46px
}

.Separator2:after,
.Separator2:before {
    content: "";
    display: block;
    position: absolute
}

.Separator:after {
    animation: Separator 100s linear infinite;
    background: url(../img/Separator/bg_02.svg) 0 0/100% 100%;
    height: 1120px;
    right: -410px;
    top: 150px;
    width: 1120px
}

.Separator.-reversed:after {
    left: -410px;
    right: auto
}

@keyframes Separator {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(-1turn)
    }
}

.LabeldedList {
    display: table;
    margin: 1.5em 0 0
}

.LabeldedList .LabeldedList__Item {
    display: table-row
}

.LabeldedList dd,
.LabeldedList dt {
    display: table-cell;
    margin: 0
}

.ButtonContainer {
    margin-top: 44px;
    text-align: center;
}

.ButtonContainer,
.PrimaryButton {
    align-items: center;
    display: flex;
    justify-content: center
}

.PrimaryButton {
    background: linear-gradient(90deg, #004d92, #a83587);
    border-radius: 8px;
    box-shadow: 8px 8px 10px rgba(0, 0, 0, .3);
    color: #fff;
    font-family: xYuMincho, "Noto Serif JP", HiraMinProN-W3, Hiragino Mincho Pro, HG正楷書体-PRO, ＤＦ中楷書体, ＭＳ 明朝, MS Mincho, serif;
    font-size: 18px;
    height: 60px;
    position: relative;
    text-decoration: none;
    transition: transform .3s, box-shadow .3s;
    width: 446px
}

.PrimaryButton:hover {
    background: linear-gradient(90deg, #1e9cd7, #6b4fa8);
    box-shadow: 6px 6px 8px rgba(0, 0, 0, .3);
    transform: translate(2px, 2px)
}

.PrimaryButton:after,
.PrimaryButton:before {
    background: no-repeat 0 0/100% 100%;
    content: "";
    display: block;
    height: 33.6px;
    width: 72.8px
}

.PrimaryButton:before {
    background-image: url(../img/PrimaryButton/bg_01.svg);
    margin-right: 12px
}

.PrimaryButton:after {
    background-image: url(../img/PrimaryButton/bg_02.svg);
    margin-left: 12px
}

@media(max-width:680px) {
    .PrimaryButton:before {
        margin-right: 0
    }

    .PrimaryButton:after {
        margin-left: 0
    }
}

.InlineLink {
    background: linear-gradient(#fff8a6, #fff8a6) no-repeat 100% 9px;
    color: inherit;
    text-decoration: none
}

.CustomMarkerList {
    display: table;
    line-height: 1.8;
    list-style: none;
    margin: 0;
    padding-left: 0
}

.CustomMarkerList:first-child {
    margin-top: 0
}

.CustomMarkerList:last-child {
    margin-bottom: 0
}

.CustomMarkerList>li {
    display: table-row;
    list-style: none
}

.CustomMarkerList .CustomMarkerList__Marker {
    display: table-cell;
    padding-right: .5em;
    padding-top: .2em
}

.CustomMarkerList .CustomMarkerList__Text {
    display: table-cell;
    padding-top: .2em;
    width: 100%
}

.CustomMarkerList>li:first-child .CustomMarkerList__Marker,
.CustomMarkerList>li:first-child .CustomMarkerList__Text {
    padding-top: 0
}

.BackToTop {
    margin: 40px 0 0;
    position: relative
}

.BackToTop .BackToTop__Button {
    background: url(../img/BackToTop/bg_01.svg) 0 0/100% 100%;
    border: 0;
    bottom: 10px;
    cursor: pointer;
    height: 96px;
    position: absolute;
    right: 20px;
    transition: opacity .3s;
    width: 84px;
    z-index: 300
}

.-hidden.BackToTop .BackToTop__Button {
    opacity: 0;
    pointer-events: none
}

.-sticky.BackToTop .BackToTop__Button {
    position: fixed
}

.PageFooter {
    background: linear-gradient(90deg, #e2f5ff, #e6e1f1);
    color: #0071bc;
    margin-top: 20px;
    padding: 32px 20px
}

.PageFooter .PageFooter__Copyright,
.PageFooter .PageFooter__LegalText {
    font-size: 12px;
    margin: 4px 0;
    text-align: center
}

@media(min-width:941px) {
    _ {
        _: 0
    }

    .-onlyLargeScreen {
        display: block !important
    }

    br.-onlyLargeScreen {
        display: inline !important
    }

    .-ignoreLargeScreen {
        display: none !important
    }
}

@media(min-width:681px) {
    _ {
        _: 0
    }

    .ColumnLayout.-col2 .ColumnLayout__Slot {
        width: calc(50% - 25px)
    }

    .ColumnLayout.-col2 .ColumnLayout__Slot:nth-child(2n+2) {
        margin-left: 50px
    }
}

@media(max-width:940px)and (min-width:681px) {
    _ {
        _: 0
    }

    .-ignoreMiddleScreen {
        display: none !important
    }
}

@media(max-width:940px) {
    _ {
        _: 0
    }

    .BackToTop .BackToTop__Button {
        height: 72px;
        width: 63px
    }
}

@media(max-width:680px) {
    _ {
        _: 0
    }

    .-onlySmallScreen {
        display: block !important
    }

    br.-onlySmallScreen {
        display: inline !important
    }

    .-ignoreSmallScreen {
        display: none !important
    }

    .Drawer:before {
        height: 93px;
        right: -21.5px;
        top: -27.5px;
        width: 93px
    }

    .Drawer .Drawer__Button {
        right: 6px;
        top: 8px;
        transform: scale(.6)
    }

    .Drawer .Drawer__Button:before {
        height: 16.8px;
        top: -14px;
        width: 78.4px
    }

    .Drawer .Drawer__PanelInner {
        background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff 80px);
        max-width: 420px;
        padding: 68px 0 30px 90px;
        width: 100%
    }

    .Drawer .Drawer__Nav {
        font-size: 38px
    }

    .Drawer .Drawer__Nav li {
        padding-left: 56px
    }

    .Drawer .Drawer__Nav li:nth-child(n+2) {
        margin-top: 38px
    }

    .Drawer .Drawer__Nav a:before,
    .Drawer .Drawer__Nav li:before {
        height: 19.84px;
        top: calc(50% - 9.92px);
        width: 43.4px
    }

    .Drawer .Drawer__NavItemLabelSub {
        font-size: 10px
    }

    .Intro {
        font-size: 17px;
        padding-bottom: 30px;
        padding-top: 30px
    }

    .Intro:after,
    .Intro:before {
        height: 25px;
        width: 165px
    }

    .Section {
        padding-bottom: 55px;
        padding-top: 55px
    }

    .ColumnLayout {
        display: block;
        margin-top: -30px
    }

    .ColumnLayout.-col2 .ColumnLayout__Slot:nth-child(2n+2) {
        margin-top: 30px
    }

    .Twitter .Twitter__Title {
        font-size: 36px;
        margin-bottom: 10px
    }

    .Twitter .Twitter__Title:after,
    .Twitter .Twitter__Title:before {
        height: 40px;
        width: 96px
    }

    .Twitter .Twitter__Body {
        border-width: 1px;
        box-shadow: 0 0 0 4px #fff, 0 0 0 5px currentColor;
        margin: 0 5px;
        padding: 20px 20px 30px
    }

    .Twitter .Twitter__BodyInner {
        height: 210px
    }

    .News .News__Title {
        font-size: 36px;
        margin-bottom: 10px
    }

    .News .News__Title:after,
    .News .News__Title:before {
        height: 40px;
        width: 96px
    }

    .News .News__Body {
        border-width: 1px;
        box-shadow: 0 0 0 4px #fff, 0 0 0 5px currentColor;
        margin: 0 5px;
        padding: 20px 20px 30px
    }

    .News .News__BodyInner {
        height: 210px
    }

    .News .News__NewsItemDate {
        font-size: 13px
    }

    .News .News__NewsItemText {
        font-size: 14px
    }

    .SectionContent {
        border-width: 1px;
        font-size: 14px;
        padding: 25px 16px 50px
    }

    .SectionContent:before {
        border-width: 1px;
        bottom: 3px;
        left: 3px;
        right: 3px;
        top: 3px
    }

    .SectionContent:after {
        background-size: 150.4px 16.8px, 150.4px 16.8px, 99.2px 43.2px, 99.2px 43.2px, 99.2px 43.2px, 99.2px 43.2px
    }

    .SectionContent .SectionContent__Title {
        margin-bottom: 20px
    }

    .SectionContent .SectionContent__TitleEn {
        font-size: 36px
    }

    .SectionContent .SectionContent__TitleJa {
        font-size: 14px
    }

    .SectionContent .SectionContent__TitleJa:after,
    .SectionContent .SectionContent__TitleJa:before {
        height: 2px;
        width: 30px
    }

    .SectionContent .SectionContent__Heading {
        font-size: 17px;
        margin: 20px 0 10px
    }

    .SectionContent .SectionContent__Heading2 {
        font-size: 17px;
        margin: 30px 0 10px
    }

    .Separator {
        height: 568px;
        margin: -284px 0
    }

    .Separator:before {
        height: 74px;
        left: calc(50% - 11.5px);
        top: 247px;
        width: 23px
    }

    .Separator:after {
        height: 450px;
        right: -192px;
        top: 115px;
        width: 450px
    }
	
	.Separator2 {
        height: 568px;
        margin: -284px 0
    }

    .Separator2:before {
        height: 74px;
        left: calc(50% - 11.5px);
        top: 247px;
        width: 23px
    }

    .Separator2:after {
        height: 450px;
        right: -192px;
        top: 115px;
        width: 450px
    }

    .Separator.-reversed:after {
        left: -192px
    }

    .LabeldedList,
    .LabeldedList .LabeldedList__Item {
        display: block
    }

    .LabeldedList .LabeldedList__Item+.LabeldedList__Item {
        margin-top: 1.2em
    }

    .LabeldedList dd,
    .LabeldedList dt {
        display: block
    }

    .ButtonContainer {
        margin-top: 32px
    }

    .PrimaryButton {
        box-shadow: 4px 4px 5px rgba(0, 0, 0, .3);
        font-size: 15px;
        height: 44px;
        max-width: 320px;
        width: 100%
    }

    .PrimaryButton:hover {
        box-shadow: 3px 3px 4px rgba(0, 0, 0, .3)
    }

    .PrimaryButton:after,
    .PrimaryButton:before {
        height: 24px;
        width: 52px
    }

    .PageFooter {
        padding: 16px 20px
    }

    .PageFooter .PageFooter__Copyright,
    .PageFooter .PageFooter__LegalText {
        font-size: 11px;
        margin: 0
    }
}

@media(-webkit-min-device-pixel-ratio:2),
(min-device-pixel-ratio:2),
(min-resolution:2dppx),
(min-resolution:192dpi) {
    _ {
        _: 0
    }
}

@media screen\0 {
    html {
        font-family: sans-serif
    }
}

@media(-webkit-min-device-pixel-ratio:2),
(min-resolution:2dppx) {
    html {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale
    }
}

/* 追記 */
.SectionContent .SectionContent__ComingSoon {
    text-align: center;
    font-size: 22px;
}
.SectionContent .SectionContent__onlinebnrTitle {
    text-align: center;
    font-size: 22px;
    margin-top: 50px;
}
@media(max-width:940px) {
.guide_movie_img img {
    width: 100%;
}
}

.codoc-buy-creator {
    display: none !important;
}
.codoc-more {
    display: none !important;
}
.mainlogo {
    max-width: 500px;
    margin: 40px auto 0;
}
.mainlogo img {
    width: 100%;
}

hr.hr_goods{
    width:100%;
    background-color:#0071bc;
    height:1px;
    border-width:0;
}
.goods_flex{
    display: flex;
    justify-content: space-between;
    flex-wrap:wrap;
}
.g_f_inner{
    width: 100%;
    margin-bottom: 40px;
    border: 3px solid #0071bc;
    border-radius: 10px;
    padding: 0 2%;
    background: linear-gradient(to left, #d2c9e5, #d2f0ff);
}
.g_f_inner img{
    width:100%;
}
.g_f_inner dt{
    margin: 5px auto 10px;
    font-weight: bold;
    font-size: 1.2em;
    line-height: 1.4em;
}
.g_f_inner dd {
    display: block;
    margin-inline-start: 0px;
}
.pc{
    display:block;
}
.sp{
    display:none;
}
@media(max-width:680px) {
    .goods_flex{
        display: block;
    }
    .g_f_inner{
        width: 95%;
    }
    .pc{
        display:none;
    }
    .sp{
        display:block;
    }
}

.image-box{
	margin:1em auto;
}
.image-box img{
	width: 100%;
}

.special_flexbox{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.special_flexbox .fl_inner_box_l{
	width: 70%;
}
.special_flexbox .fl_inner_box_r{
	width: 30%;
}
.video{
    position:relative;
    max-width: 640px;
    height: 0px;
    padding-top: 56.25%;
    margin:auto;
}
.video iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.line_through {
    text-decoration: line-through;
}
.center{
    text-align: center;
}
@media screen and (max-width:768px){
	.special_flexbox .fl_inner_box_l,.special_flexbox .fl_inner_box_r{
	width: 100%;
}
	.special_flexbox{
	flex-direction: column}
}