@charset "UTF-8";
/* Scss Document */
/* サイト：ブラックカラー */
/* サイト：テーマカラー */
/* サイト：テーマカラー */
/* ================================
   #設定：ブレイクポイント：min-width
================================ */
/* ================================
   #設定：ブレイクポイント：max-width
================================ */
/* ================================
   #設定：ヘッダーの高さ
================================ */
@media screen and (min-width: 768px) {
    .sp-only {
        display: none;
        visibility: hidden;
    }
}
.pc-only {
    display: none;
    visibility: hidden;
}
@media screen and (min-width: 768px) {
    .pc-only {
        display: inherit;
        visibility: visible;
    }
}
/* ================================================================
   #角丸
================================================================ */
.round-box {
    border-radius: 10px;
}
html {
    scroll-behavior: smooth;
}
body {
    /*background-color: $color_body;*/
    color: #231815;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    font-style: normal;
    /*	&::-webkit-scrollbar {
		display:none;
	}*/
}
a:hover {
    color: #FF4000;
}
/* ================================================================
   #背景
================================================================ */
#ncc-bg {
    background-color: rgba(255, 255, 255, 0.9);
    /*background-image: url("../img/theme/bg_pattern.svg");
	background-repeat: repeat;
	background-size: 120px 120px;*/
    margin: auto;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden;
}
@media screen and (min-width: 1024px) {
    #ncc-bg {
        background-color: rgba(255, 255, 255, 0.5);
    }
}
.smork::before {
    content: "";
    background-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 1;
    margin: auto;
}
#event-bnr-slider {
    display: none;
}
#event-bnr-slider.slick-initialized {
    display: block;
}
.br-triangle {
    background-image: url("../img/theme/br_triangle.png");
    background-repeat: repeat;
    background-position: center;
    background-size: 320px;
    background-attachment: fixed;
}
/* ================================================================
   #フォント
================================================================ */
.font-eng {
    font-style: normal;
    font-family: 'Montserrat', sans-serif;
}
.font-eng-2 {
    font-family: din-condensed, sans-serif;
    font-style: normal;
}
.color-theme {
    color: #ff6000;
    background: -webkit-linear-gradient(-180deg, #f7b42c, #ff6000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.notes {
    font-size: 85%;
    text-indent: -1em;
    padding-left: 1em;
}
.img-box figure {
    padding-top: 56.25%;
    overflow: hidden;
}
.img-box figure img {
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
}
/* ================================================================
   #コンポーネント：バッジ
================================================================ */
.badge {
    background-color: #f7b42c;
    background-image: linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);
    border-radius: 100%;
    display: block;
    height: 200px;
    width: 200px;
    position: fixed;
    bottom: 0;
    right: 0;
    transform: scale3d(0.5, 0.5, 1);
    -webkit-transform: scale3d(0.5, 0.5, 1);
    transform-origin: right bottom;
    transition: transform ease-out .2s;
    z-index: 20;
    display: none;
}
.badge:hover {
    background-color: #ff6000;
}
.badge.fixed {
    transform: scale3d(0.3, 0.3, 1);
    -webkit-transform: scale3d(0.25, 0.25, 1);
}
.badge.fixed:hover {
    transform: scale3d(0.5, 0.5, 1);
    -webkit-transform: scale3d(0.5, 0.5, 1);
}
.badge a {
    display: block;
    height: 100%;
    width: 100%;
}
.badge-student {
    display: block;
    max-width: 60%;
    margin: auto;
    position: absolute;
    right: 0;
    bottom: 50%;
    left: 0;
}
.badge-copy {
    display: block;
    max-width: 90%;
    margin: auto;
    position: absolute;
    top: -56px;
    right: 0;
    left: -24px;
    transform: rotate(-8deg);
}
.badge-oc-days-txt {
    font-size: 6.4rem;
    color: #FFF;
    line-height: 1;
    position: absolute;
    bottom: .3em;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    display: none;
}
.badge-oc-days-txt:nth-of-type(1) {
    display: block;
}
.img-oc-days {
    width: 80%;
    position: absolute;
    bottom: 36px;
    left: 0;
    right: 0;
    margin: auto;
}
.badge-txt small {
    display: block;
    font-weight: 700;
    font-size: 1.4rem;
    padding-left: .5em;
}
@media (min-width: 768px) {
    .badge {
        transform: scale3d(0.75, 0.75, 1);
        -webkit-transform: scale3d(0.75, 0.75, 1);
    }
}
@media (min-width: 1280px) {
    .badge {
        transform: none;
        bottom: 20px;
        right: 20px;
    }
    .badge.fixed {
        transform: scale3d(0.6, 0.6, 1);
        -webkit-transform: scale3d(0.6, 0.6, 1);
    }
    .badge.fixed:hover {
        transform: none;
    }
}
@media screen and (min-width: 1024px) {
    .badge {
        display: block;
    }
}
/* ================================================================
   #コンポーネント：パンくず
================================================================ */
/* ================================================================
   #パンくずリスト
================================================================ */
.wf_theme-breadcrumbs {
    padding: 2em 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    z-index: 2;
}
.wf_theme-breadcrumbs ul {
    display: flex;
    font-size: 1rem;
}
.wf_theme-breadcrumbs ul > span {
    display: inline-block;
    line-height: 1.2;
    padding-right: 4em;
    white-space: nowrap;
}
.wf_theme-breadcrumbs ul > span::before {
    content: "";
    border-top: #231815 solid 2px;
    border-left: #231815 solid 2px;
    height: 1em;
    width: 1em;
    margin: auto;
    position: absolute;
    top: 0;
    right: 2em;
    bottom: 0;
    transform: rotate(135deg);
}
.wf_theme-breadcrumbs ul .current-item {
    padding-right: 5vw;
}
.wf_theme-breadcrumbs ul .current-item::before {
    display: none;
}
@media screen and (min-width: 768px) {
    .wf_theme-breadcrumbs ul {
        font-size: 1.2rem;
    }
    .wf_theme-breadcrumbs ul > span {
        padding-right: 6em;
    }
    .wf_theme-breadcrumbs ul > span::before {
        right: 3em;
    }
    .wf_theme-breadcrumbs ul .current-item {
        padding-right: 0;
    }
}
@media screen and (min-width: 1366px) {
    .wf_theme-breadcrumbs ul > span {
        padding-right: 6em;
    }
    .wf_theme-breadcrumbs ul > span::before {
        right: 3em;
    }
    .wf_theme-breadcrumbs ul .current-item {
        padding-right: 0;
    }
}
#theme-breadcrumbs {
    background-color: #FFF;
    display: block;
    padding-right: 5em;
}
@media screen and (min-width: 1366px) {
    #theme-breadcrumbs {
        transform: translateY(-50%);
        display: inline-block;
    }
}
/* ================================================================
   #コンポーネント：タブ
================================================================ */
/* Scss Document：wf_component_tab.scss*/
/* ================================================================
   #タブ
================================================================ */
.js_tab-swicth.js_is-active {
    z-index: 2;
}
.js_panel {
    display: none;
}
.js_panel.js_is-active {
    display: inherit;
}
/* ================================================================
   #コンポーネント：ボタン
================================================================ */
/* Scss Document */
/* ================================================================
   #ボタン
================================================================ */
.wf_btn-wrap {
    text-align: center;
}
.wf_btn {
    background-color: #A7A3A1;
    border: transparent solid 2px;
    border-radius: 4px;
    color: #FFF;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    font-weight: 600;
    min-height: 48px;
    padding: .5em 1em;
    z-index: 2;
}
.wf_btn.btn-arrow {
    padding-right: 2em;
}
.wf_btn.btn-arrow::before {
    content: "";
    border-top: #FFF solid 2px;
    border-left: #FFF solid 2px;
    height: 8px;
    width: 8px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 1em;
    bottom: 0;
    transform: rotate(135deg);
    opacity: 0.5;
}
.wf_btn:hover {
    background-color: #ffb808;
    color: #FFF;
}
.wf_btn:hover.btn-arrow::before {
    opacity: 1;
}
.more-btn {
    /*background-color: #f7b42c;
      background-image: linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);*/
    background: #4c4d55;
    /*box-shadow: rgba(0,0,0,0.3) 0 4px 8px -4px;*/
    border: none;
    border-radius: 100px;
    min-height: 30px;
    padding: 0 3em;
    transition: transform .2s;
}
@media (min-width:768px) {
    min-height: 40px;
}
.more-btn .btn-arrow {
    display: inline-block;
    padding-right: 1.5em;
}
.more-btn .btn-arrow::before {
    content: "";
    background-image: url("../img/theme/icon_arrow.svg");
    background-size: auto 100%;
    background-position: center;
    width: 12px;
    height: 12px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
.more-btn:hover {
    background: linear-gradient(45deg, #ff0033 10%, #fff66c, #ffa36c 90%);
    background-size: 600% 600%;
    animation: AnimationName .8s ease 1 forwards;
    transform: translateY(-3px);
}
.lage-btn {
    background-color: #4c4d55;
    border: none;
    border-radius: 6px;
    /*box-shadow: rgba(0, 0, 0, 0.3) 0 4px 8px -4px;*/
    font-size: 1.8rem;
    display: block;
    width: 100%;
    margin-top: 10px;
    padding: 0;
}
.lage-btn.orange {
    background: #ff6000;
}
.lage-btn.orange:hover {
    background: linear-gradient(45deg, #ff6000 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
.lage-btn .btn-inner {
    padding: 1.5em 48px 1.5em 64px;
}
.lage-btn .btn-inner .btn-icon {
    height: 36px;
    width: 36px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 16px;
}
.lage-btn .btn-inner .btn-icon svg {
    display: block;
    height: auto;
    width: 100%;
    fill: #FFF;
}
.lage-btn .btn-inner .btn-arrow-icon {
    background-image: url("../img/theme/icon_arrow.svg");
    background-size: auto 100%;
    background-position: center;
    height: 12px;
    width: 12px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
}
.lage-btn.line-btn {
    background-color: #00c300;
}
.lage-btn .btn-txt {
    display: block;
    font-size: 1.2rem;
    margin-bottom: .5em;
}
.lage-btn p {
    font-size: 1.8rem;
    line-height: 1.2;
}
@media screen and (min-width: 1366px) {
    .lage-btn p {
        font-size: 2rem;
        line-height: 1.2;
    }
}
.btn-hover:hover {
    background: linear-gradient(45deg, #4c4d55 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
.btn-hover.line-btn:hover {
    background: linear-gradient(45deg, #00c300 20%, #D2FF4D, #37E68A 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
.news-item:hover .btn-hover {
    background: linear-gradient(45deg, #4c4d55 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
@keyframes AnimationName {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}
/* ================================================================
   #コンポーネント：ドロワーメニュー
================================================================ */
/* Scss Document：wf_component_tab.scss*/
/* ================================================================
   #コンポーネント：ドロワーメニュー
================================================================ */
.js_is-fix {
    height: 100% !important;
    overflow: hidden;
}
@media screen and (min-width: 1366px) {
    .js_is-fix {
        height: auto;
        overflow: auto;
    }
}
.wf_drawer-menu-btn {
    background-color: #ff6000;
    border-radius: 0;
    cursor: pointer;
    width: 64px;
    height: 64px;
    margin: auto;
    position: fixed;
    top: 0;
    right: 0;
    transform: translate3d(0, 0, 0);
    z-index: 1200;
}
@media screen and (min-width: 1366px) {
    .wf_drawer-menu-btn {
        display: none;
    }
}
.wf_drawer-menu-btn-icon {
    height: 16px;
    width: 20px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: transform .16s;
    transition-timing-function: ease-out;
    transition-delay: .16s;
}
.wf_drawer-menu-btn-icon span {
    background-color: #FFF;
    display: block;
    height: 2px;
    width: 100%;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: transform .16s;
    transition-timing-function: ease-out;
}
.wf_drawer-menu-btn-icon span:nth-child(1) {
    transform: translateY(-8px);
}
.wf_drawer-menu-btn-icon span:nth-child(3) {
    transform: translateY(8px);
}
.js_is-active .wf_drawer-menu-btn-icon {
    transform: rotate(135deg);
}
.js_is-active .wf_drawer-menu-btn-icon span:nth-child(1) {
    transform: translateY(0);
}
.js_is-active .wf_drawer-menu-btn-icon span:nth-child(2) {
    transform: rotate(90deg);
}
.js_is-active .wf_drawer-menu-btn-icon span:nth-child(3) {
    transform: translateY(0);
}
/* ================================
   #コンポーネント：ドロワーメニュー：コンテナ
================================ */
.wf_drawer-menu-container {
    display: block;
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    transform: translate3d(0, 0, 0);
    transition: opacity 0s;
    transition-timing-function: ease-out;
    z-index: -100;
}
.wf_drawer-menu-container.js_is-active {
    opacity: 1;
    transition: opacity .16s;
    z-index: 120;
}
@media screen and (min-width: 1366px) {
    .wf_drawer-menu-container {
        display: none !important;
    }
}
/* ================================
   #コンポーネント：ドロワーメニュー：コンテンツ
================================ */
.wf_drawer-menu {
    margin: auto;
    padding-top: 80px;
    padding-bottom: 120px;
}
.wf_drawer-menu .wf_nav-list {
    list-style: none;
}
.wf_drawer-menu .wf_nav-list span, .wf_drawer-menu .wf_nav-list a {
    display: flex;
    align-items: center;
    color: #FFF;
    font-size: 1.4rem;
    font-weight: 600;
    padding: 0 5vw;
    min-height: 56px;
}
.wf_drawer-menu .wf_nav-list span small, .wf_drawer-menu .wf_nav-list a small {
    display: inline-block;
    font-size: 1rem;
    font-weight: 400;
    padding-left: 1.5em;
    opacity: 0.5;
}
.wf_drawer-menu .wf_nav-list .btn-hover:hover {
    background: linear-gradient(45deg, #ffb808 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
@media screen and (min-width: 768px) {
    .wf_drawer-menu {
        max-width: 640px;
    }
}
.wf_drawer-menu-btn-area {
    margin-top: 60px;
    list-style: none;
}
.wf_drawer-menu-btn-area li {
    padding: 0 5vw;
}
.wf_drawer-menu-item {
    transform: translate3d(80px, 0, 0);
    opacity: 0;
}
.wf_drawer-menu-item.js_is-active {
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: transform .3s, opacity .3s;
    transition-timing-function: ease-out;
}
/* ================================
   #ドロワーメニュー：検索
================================ */
.wf_drawer-menu-container .site-search {position: relative;}
.wf_drawer-menu-container .site-search .content {
    width: 100%;
    background: rgba(255,255,255,.4);
    /*border-radius: 5px;*/
    padding: 5px;
}
.wf_drawer-menu-container .site-search .content input[type="text"],
.wf_drawer-menu-container .site-search .content button[type="submit"] {
    vertical-align: middle;
}
.wf_drawer-menu-container .site-search .content input[type="text"] {
    width: calc(100% - 50px);
    padding: 10px;
    color: #fff;
    font-size: 16px;
    line-height: 120%;
}
.wf_drawer-menu-container .site-search .content input[type="text"]::placeholder {
    color: rgba(255,255,255,.6);
}
.wf_drawer-menu-container .site-search .content button[type="submit"] {
    padding: 15px;
}
/* ================================
   #コンポーネント：ドロワーメニュー：背景
================================ */
.wf_drawer-menu-overlay {
    background-color: #ff6000;
    display: block;
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    transition: opacity 0s;
    transition-timing-function: ease-out;
    z-index: -100;
}
.wf_drawer-menu-overlay.js_is-active {
    opacity: .98;
    transition: opacity .16s;
    z-index: 100;
}
@media screen and (min-width: 1366px) {
    .wf_drawer-menu-overlay {
        display: none !important;
    }
}
/* ================================================================
   #コンポーネント：アコーディオン
================================================================ */
.js_accordion-switch {
    cursor: pointer;
}
.js_accordion-item {
    background-color: #ffb808;
    display: none;
    line-height: 0;
}
.js_accordion-item ul {
    list-style: none;
}
.js_accordion-item ul a{
    color: #231815!important;
}
.js_accordion-icon {
    cursor: pointer;
    height: 1em;
    width: 1em;
    margin: auto;
    position: absolute;
    top: 0;
    right: calc(5vw + 6px);
    bottom: 0;
    transition: transform .3s;
}
.js_accordion-icon::before, .js_accordion-icon::after {
    content: "";
    border-top: #FFF solid 2px;
    height: 0;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.js_accordion-icon::after {
    transform: rotate(90deg);
    transition: transform .3s;
}
.js_accordion-switch.js_is-active .js_accordion-icon {
    transform: rotate(180deg);
}
.js_accordion-switch.js_is-active .js_accordion-icon::after {
    transform: rotate(180deg);
}
/* ================================================================
   #ヘッダー
================================================================ */
/* Scss Document */
/* ================================================================
   #ヘッダー
================================================================ */
.wf_theme-header {
    z-index: 1000;
}
.wf_theme-header {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    transform: translate3d(0, 0, 0);
    transition: transform .16s, background-color .1s, box-shadow .16s;
}
.wf_theme-header .wf_theme-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
}
@media screen and (min-width: 1024px) {
    .wf_theme-header .wf_theme-header-inner {
        height: 100px;
        transition: transform .16s, height .16s;
    }
}
.wf_theme-header.js_is-active .wf_theme-header-inner {
    height: 64px;
}
@media screen and (min-width: 1024px) {
    .wf_theme-header.js_is-active {
        background-color: #FFF;
    }
    .wf_theme-header.js_is-active .wf_theme-header-inner {
        height: 72px;
    }
}
.wf_site-header-logo {
    height: 20px;
    transition: height .2s;
}
.wf_site-header-logo #ncc-logo-name {
    fill-rule: evenodd;
    clip-rule: evenodd;
}
@media screen and (min-width: 1024px) {
    .wf_site-header-logo {
        height: 26px;
    }
}
#ncc-logo-wrap {
    display: block;
}
#ncc-logo-mark-wrap, #ncc-logo-name-wrap {
    height: 100%;
}
#ncc-logo-mark-wrap svg, #ncc-logo-name-wrap svg {
    display: block;
    fill: #FFF;
    transition: fill .1s;
}
#ncc-logo-mark-wrap #ncc-logo-name-wrap {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    transform: translateX(55%);
}
#ncc-logo-name-wrap {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    height: 60%;
    overflow: hidden;
}
.wf_theme-header.js_is-active #ncc-logo-mark-wrap svg, .wf_theme-header.js_is-active #ncc-logo-name-wrap svg {
    fill: #ff6000;
}
.js_is-fix #ncc-logo-mark-wrap svg, .js_is-fix #ncc-logo-name-wrap svg {
    fill: #FFF !important;
}
/* ================================================================
   #グローバルナビ
================================================================ */
#g-nav {
    display: none;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    padding-right: 0;
}
#g-nav .wf_nav-list, #g-nav .wf_nav-item, #g-nav .wf_nav-link {
    height: 100%;
}
#g-nav .wf_nav-list {
    list-style: none;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    margin: 0;
}
#g-nav .wf_nav-list:nth-of-type(2) {
    /*margin-left: 32px;*/
    margin-left: 16px;
}
#g-nav .wf_nav-item + .wf_nav-item {
    margin-left: 0;
}
#g-nav .wf_nav-link {
    color: #FFF;
    font-size: 1.4rem;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /*padding: 0px 0.833337vw;*/
    padding: 0px 0.633337vw;
    transition: color .1s;
}
#g-nav .header-btn {
    display: flex;
    align-items: center;
}
#g-nav .header-btn .wf_nav-link {
    background-color: #ff6000;
    border-radius: 0;
    color: #FFF !important;
    height: 72px;
    /*padding: 0 40px;*/
    padding: 0 20px;
}
#g-nav .header-btn .wf_nav-link:hover {
    background-color: #ff6000 !important;
}
#g-nav .header-btn + .header-btn .wf_nav-link {
    background-color: #ffb808;
}
@media screen and (min-width: 1366px) {
    #g-nav {
        display: flex;
    }
    #g-nav .wf_nav-link {
        font-size: 1.4rem;
    }
}
@media screen and (max-width: 1675px) and (min-width: 1366px) {
    .wf_site-header-logo.wf_col-20-md {
        flex-basis: 15%;
        max-width: 15%;
    }
    .wf_site-header-logo {height: 20px;}
    #g-nav.wf_col-80-md {
        flex-basis: 85%;
        max-width: 85%;
    }
    #g-nav .header-btn .wf_nav-link {
        padding-left: 17px;
        padding-right: 17px;
    }
}
@media screen and (max-width: 1470px) and (min-width: 1366px) {
    #g-nav .wf_nav-link {
        font-size: 1.3rem;
    }
}
.wf_theme-header.js_is-active #g-nav .wf_nav-link {
    color: #231815;
}
/* ================================
   #グローバルナビ：検索
================================ */
.wf_theme-header .site-search {position: relative;}
.wf_theme-header .site-search .btn {
    padding: 10px;
    line-height: 100%;
    cursor: pointer;
}
.wf_theme-header .site-search .btn span {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    background: url(../img/icon_search-white.svg) no-repeat center;
    background-size: contain;
    -webkit-transition: .2s ease all;
    transition: .2s ease all;
    width: 16px;
    height: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-indent: 200%;
}
.wf_theme-header.js_is-active .site-search .btn span {
    background-image: url(../img/icon_search.svg);
}
.wf_theme-header .site-search .content {
    display: none;
    position: absolute;
    width: 50%;
    top: calc(100% + 10px);
    width: 250px;
    right: -5px;
    background: #231815;
    border-radius: 5px;
    padding: 15px;
}
.wf_theme-header .site-search .content input[type="text"],
.wf_theme-header .site-search .content button[type="submit"] {
    vertical-align: middle;
}
.wf_theme-header .site-search .content input[type="text"] {
    width: calc(100% - 37px);
    padding: 10px;
    color: #fff;
}
.wf_theme-header .site-search .content button[type="submit"] {
    padding: 10px;
}

/* ================================
   #グローバルナビ：現在地
================================ */
#g-nav .wf_this-current .wf_nav-link {
    color: #ff6000 !important;
}
#g-nav .wf_has-children-current {
    color: #FF4000;
}
/* ================================
   #グローバルナビ：ドロップダウン
================================ */
#g-nav .wf_has-children .wf_list-children {
    background-color: #231815;
    border-radius: 0 0 8px 8px;
    list-style: none;
    min-width: 24em;
    padding: 0;
    position: absolute;
    top: 100%;
    left: 0;
    display: none;
}
#g-nav .wf_has-children .wf_list-children.right {
    left: auto;
    right: 0;
}
#g-nav .wf_has-children .wf_list-children.right::before {
    left: auto;
    right: 0;
}
#g-nav .wf_has-children .wf_list-children a {
    color: #FFF;
    font-weight: 600;
    display: block;
    padding: 15px 30px;
}
#g-nav .wf_has-children .wf_list-children a::before {
    content: "";
    border-top: #FFF solid 2px;
    border-left: #FFF solid 2px;
    height: 8px;
    width: 8px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 32px;
    bottom: 0;
    opacity: 0.5;
    transform: rotate(135deg);
}
#g-nav .wf_has-children .wf_list-children a:hover {
    background-color: rgba(255, 255, 255, 0.2);
}
#g-nav .wf_has-children .wf_list-children a:hover::before {
    opacity: 1;
}
#g-nav .wf_has-children:hover::before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 6px 10px 6px;
    border-color: transparent transparent #231815 transparent;
    margin: auto;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
}
#g-nav .wf_has-children:hover .wf_list-children {
    display: block;
}
#g-nav .wf_has-children:last-of-type .wf_list-children {
    left: auto;
    right: 0;
}
.wf_theme-header.js_is-active #g-nav .wf_has-children .wf_list-children a {
    color: #FFF;
}
/* ================================
   #グローバルナビ：ドロップダウン：現在地
================================ */
#g-nav .wf_this-current {
    color: #FF4000;
}
#g-nav .wf_has-children-current {
    color: #FF4000;
}
/* ================================================================
   #フッター
================================================================ */
/* Scss Document */
/* ================================================================
   #フッター：コンバージョン
================================================================ */
#footer-conversion {
    padding: 64px 0;
    width: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
}
#footer-conversion::before {
    content: "";
    background-color: rgba(80, 80, 80, 0.4);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}
#footer-conversion .wf_container {
    z-index: 3;
}
#footer-conversion h3 {
    color: #FFF;
    margin-bottom: 1em;
}
@media screen and (min-width: 768px) {
    #footer-conversion {
        padding: 64px 0;
    }
}
.bg_footer-conversion {
    background-image: url("../img/theme/photo_footer.jpg");
    background-size: cover;
    background-position: center;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
.btn-conversion {
    background-color: transparent;
    border: #FFF solid 2px;
    font-size: 1.8rem;
    display: block;
    width: 100%;
    margin-top: 10px;
    padding: 1em 1.5em;
}
.btn-conversion .btn-txt {
    display: block;
    font-size: 1.2rem;
    margin-bottom: .5em;
}
.btn-conversion p {
    font-size: 1.8rem;
}
.btn-conversion:hover {
    background-color: #ff6000;
    border-color: #ff6000;
}
.btn-conversion.tel {
    border: transparent solid 2px;
}
.btn-conversion.tel .font-eng {
    font-size: 3.2rem;
    line-height: 1;
}
.btn-conversion.tel time {
    font-size: 1.2rem;
    font-weight: normal;
    line-height: 1.2;
    display: block;
    margin-top: 10px;
}
.btn-conversion.tel:hover {
    background-color: transparent !important;
    border-color: transparent !important;
}
@media screen and (min-width: 1024px) {
    .btn-conversion p {
        font-size: 2rem;
    }
}
/* ================================================================
   #フッター
================================================================ */
.wf_theme_footer {
    background-color: #FFF;
    background-clip: content-box;
    width: 100%;
    z-index: 4;
}
/* ================================================================
   #フッター：googlemap
================================================================ */
#footer-gmap-wrap {
    background-color: #FFF;
    padding: 0;
}
#footer-gmap-wrap address {
    padding-top: 32px;
    padding-bottom: 64px;
}
@media screen and (min-width: 1024px) {
    #footer-gmap-wrap {
        padding: 60px 0;
    }
}
.footer-gmap {
    padding-top: 100%;
}
@media screen and (min-width: 768px) {
    .footer-gmap {
        padding-top: 75%;
    }
}
@media screen and (min-width: 1024px) {
    .footer-gmap {
        padding-top: 30%;
    }
}
#footer-address-logo {
    display: block;
    fill: #ff6000;
    fill-rule: evenodd;
    clip-rule: evenodd;
    height: auto;
    width: 100%;
    margin-bottom: 2em;
}
@media screen and (min-width: 1024px) {
    #footer-address-logo {
        height: 30px;
        width: auto;
    }
}
#footer-gmap-wrap address dt {
    float: left;
    width: 7em;
}
#footer-gmap-wrap address dd {
    overflow: hidden;
}
/* ================================================================
    #フッター：フッターサイトマップ
================================================================ */
#footer-sitemap-wrap {
    background-color: #ff6000;
    padding-top: 60px;
    padding-bottom: 60px;
}
#footer-sitemap .wf_nav-list, #footer-sitemap .wf_list-children {
    list-style: none;
}
#footer-sitemap .wf_nav-link {
    padding-left: 1.5em;
    display: block;
    color: #FFF;
}
#footer-sitemap .wf_nav-link:hover {
    color: #FFF;
}
#footer-sitemap > .wf_nav-list {
    display: flex;
    flex-wrap: wrap;
    flex-grow: 1;
    margin: -16px -5px;
}
#footer-sitemap > .wf_nav-list > .top-level-page {
    flex-basis: 50%;
    max-width: 50%;
    padding: 16px 5px;
}
#footer-sitemap > .wf_nav-list > .top-level-page > .wf_nav-link {
    border-bottom: rgba(255, 255, 255, 0.5) solid 1px;
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 1em;
    padding-bottom: 5px;
}
#footer-sitemap > .wf_nav-list > .top-level-page > .wf_nav-link::before {
    content: "";
    border-top: #FFF solid 2px;
    height: 0;
    width: 1em;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 4px;
    left: 0;
}
#footer-sitemap > .wf_nav-list > .top-level-page > .wf_nav-link::after {
    content: "";
    border-top: #FFF solid 1px;
    height: 0;
    width: 4em;
    margin: auto;
    position: absolute;
    bottom: -1px;
    left: 0;
}
#footer-sitemap > .wf_nav-list > .top-level-page > .wf_nav-link:hover::before {
    border-color: #FFF;
}
@media screen and (min-width: 768px) {
    #footer-sitemap > .wf_nav-list {
        margin-left: -10px;
        margin-right: -10px;
    }
    #footer-sitemap > .wf_nav-list .top-level-page {
        flex-basis: 25%;
        max-width: 25%;
        padding-left: 10px;
        padding-right: 10px;
    }
}
@media screen and (min-width: 1024px) {
    #footer-sitemap > .wf_nav-list {
        margin-left: -10px;
        margin-right: -10px;
    }
    #footer-sitemap > .wf_nav-list .top-level-page {
        flex-basis: 20%;
        max-width: 20%;
        padding-left: 10px;
        padding-right: 10px;
    }
}
#footer-sitemap .wf_list-children > .wf_nav-item {
    margin-top: 5px;
}
/* ==============================================================
   #ソーシャル
   ============================================================== */
.sns-section {
    padding-top: 48px;
    padding-bottom: 48px;
}
@media screen and (min-width: 768px) {
    .sns-section {
        padding-top: 96px;
    }
}
.links-sns-list {
    display: flex;
    flex-wrap: wrap;
    flex-grow: 1;
    justify-content: center;
    list-style: none;
}
.links-sns-list .links-sns-list-iterm {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
}
.links-sns-list .links-sns-list-iterm a {
    background-color: #231815;
    border-radius: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    width: 48px;
}
.links-sns-list .links-sns-list-iterm a svg {
    display: block;
    fill: #FFF;
    height: 24px;
    width: auto;
}
.links-sns-list .links-sns-list-iterm a:hover {
    background-color: #ff6000;
}
.links-sns-list .links-sns-list-iterm a:hover svg {
    fill: #FFF;
}
.links-sns-list .links-sns-list-iterm.instagram a:hover {
    background-image: linear-gradient(-135deg, #ff6000, #ff6000, #ff6000);
}
@media screen and (min-width: 1024px) {
    .links-sns-list {
        margin: -20px;
    }
    .links-sns-list .links-sns-list-iterm {
        padding: 20px;
    }
}
@media screen and (min-width: 1366px) {
    .links-sns-list .links-sns-list-iterm a {
        border-radius: 80px;
        height: 80px;
        width: 80px;
    }
    .links-sns-list .links-sns-list-iterm a svg {
        height: 32px;
    }
}
.post-container .links-sns-list .links-sns-list-iterm {
    padding: 10px 4px;
}
.post-container .links-sns-list .links-sns-list-iterm a {
    border-radius: 4px;
    height: 44px;
    width: 96px;
}
.post-container .links-sns-list .links-sns-list-iterm a svg {
    height: 24px;
    transform: scale(0.75);
}
.links-sns-ttl {
    text-align: center;
    margin: auto auto 1em;
    font-size: 1.8rem;
    letter-spacing: .1em;
    padding-left: .1em;
}
.links-sns-ttl span {
    display: inline-block;
    padding: 0 1em;
}
.links-sns-ttl span::before {
    content: "";
    border-left: #231815 solid 1px;
    height: 1.5em;
    width: 0;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    transform: rotate(-16deg);
}
.links-sns-ttl span::after {
    content: "";
    border-left: #231815 solid 1px;
    height: 1.5em;
    width: 0;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    transform: rotate(16deg);
}
@media screen and (min-width: 768px) {
    .links-sns-ttl {
        font-size: 2.4rem;
    }
}
.post-container .links-sns-ttl {
    font-size: 1.4rem;
    margin-bottom: 1em;
}
@media screen and (min-width: 768px) {
    .post-container {
        font-size: 1.6rem;
        margin-bottom: 2em;
    }
}
.links-sns-list-iterm.line a {
    background-color: #00c300;
}
.links-sns-list-iterm.twitter a {
    background-color: #1da1f2;
}
.links-sns-list-iterm.facebook a {
    background-color: #3b5998;
}
.links-sns-list-iterm.instagram a {
    background-image: linear-gradient(-135deg, #1400c8, #b900b4, #f50000);
}
.links-sns-list-iterm.youtube a {
    background-color: #CC0000;
}
/* ================================================================
   #フッター：バナー
================================================================ */
#footer-bnr-wrap {
    padding: 0 0 64px;
    overflow: hidden;
}
#footer-slider {
    list-style: none;
    max-width: 320px;
    margin: auto;
    padding: 0 50px;
}
#footer-slider .slick-list {
    overflow: visible;
}
#footer-slider .slide-item {
    padding: 0 4px;
}
#footer-slider .bnr-item {
    border: #F7F7F7 solid 2px;
    display: block;
}
@media screen and (min-width: 768px) {
    #footer-slider {
        max-width: 640px;
    }
}
@media screen and (min-width: 1024px) {
    #footer-slider {
        max-width: 960px;
    }
}
#footer-slider:hover .slick-arrow {
    opacity: 1;
}
#copyright {
    padding-bottom: 100px;
}
/* ==============================================================
   #ページの先頭に戻る
   ============================================================== */
.wf_page-top, .wf_page-bottom {
    position: fixed;
    margin: auto;
    right: 5px;
    bottom: 20px;
    z-index: 100;
}
.wf_page-top {
    bottom: 80px;
    right: 0;
}
.wf_page-top a, .wf_page-bottom a {
    background-color: #4c4d55;
    border-radius: 40px 0 0 40px;
    display: block;
    width: 40px;
    height: 40px;
}
.wf_page-top a::before, .wf_page-bottom a::before {
    content: "";
    border-top: #FFF solid 2px;
    border-left: #FFF solid 2px;
    width: 10px;
    height: 10px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    margin: auto;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    bottom: 0;
}
.wf_page-bottom a::before {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    top: 0;
    bottom: 5px;
}
.wf_page-top a:hover, .wf_page-bottom a:hover {
    background-color: #4c4d55;
}
.wf_page-top a:hover::before, .wf_page-bottom a:hover::before {
    border-top: #FFF solid 2px;
    border-left: #FFF solid 2px;
}
@media screen and (min-width: 768px) {
    .wf_page-top, .wf_page-bottom {
        right: 10px;
        bottom: 30px;
    }
    .wf_page-top {
        bottom: 10px;
        right: 0;
    }
    .wf_page-top a, .wf_page-bottom a {
        width: 48px;
        height: 48px;
    }
}
/* ================================================================
   #ページ：トップページ
================================================================ */
/* Scss Document */
/* ================================================================
   #トップ：キービジュアル
================================================================ */
#ncc-billboard {
    background-color: #151D31;
    height: calc(100vh - 80px);
    overflow: hidden;
}
@media screen and (min-width: 768px) {
    #ncc-billboard {
        height: 56.25vw;
    }
}
@media screen and (min-width: 1366px) {
    #ncc-billboard {
        height: 100vh;
    }
}
#ncc-billboard-img {
    background-image: url("../img/theme/kv_sp.jpg");
    background-size: cover;
    background-position: center bottom;
    height: 100%;
}
@media screen and (min-width: 768px) {
    #ncc-billboard-img {
        background-image: url("../img/theme/kv.jpg");
    }
}
#ncc-billboard-layer-2 {
    background-image: url("../img/theme/kv_layer_02_sp.png");
    background-size: cover;
    background-position: center bottom;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 8;
}
@media screen and (min-width: 768px) {
    #ncc-billboard-layer-2 {
        background-image: url("../img/theme/kv_layer_02.png");
        background-size: cover, cover;
        background-position: center bottom, center;
    }
}
#ncc-billboard .video-wrap {
    width: 100%;
    height: 200%;
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: 0;
    overflow: hidden;
}
#ncc-billboard video {
    width: auto;
    height: 100%;
    z-index: 1;
    margin-left: -120%;
}
@media screen and (min-width: 768px) {
    #ncc-billboard video {
        width: auto;
        height: 100%;
        margin-left: auto;
    }
}
.bg-wrap {
    filter: brightness(500%) hue-rotate(30deg) contrast(3) blur(0) grayscale(0) invert(100%) opacity(1);
    -webkit-filter: brightness(500%) hue-rotate(30deg) contrast(3) blur(0) grayscale(0) invert(100%) opacity(1);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}
@media screen and (min-width: 768px) {
    .bg-wrap {
        filter: brightness(500%) hue-rotate(30deg) contrast(3) blur(0) grayscale(0) invert(100%) opacity(1);
    }
}
/* ================================================================
   #トップ：おしらせ
================================================================ */
#ncc-latest-box {
    background-color: #FFF;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    height: 64px;
    padding-left: 5vw;
    padding-right: 15vw;
    z-index: 30;
}
@media screen and (min-width: 768px) {
    #ncc-latest-box {
        padding-left: 1.875vw;
        padding-right: 48px;
        position: absolute;
        top: 0;
        left: 0;
        transform: translateY(-50%);
        width: 60%;
    }
}
@media screen and (min-width: 1024px) {
    #ncc-latest-box {
        height: 120px;
    }
}
@media screen and (min-width: 1366px) {
    #ncc-latest-box {
        height: 120px;
        width: 40%;
    }
}
#ncc-latest-box a {
    display: flex;
    overflow: hidden;
}
#ncc-latest-box a::before {
    /* content: "";*/
    border-top: #231815 solid 2px;
    height: 0;
    width: 1.5em;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
#ncc-latest-box a .latest-ttl {
    font-weight: 600;
    flex-basis: 5em;
    max-width: 5em;
}
#ncc-latest-box a .marquee {
    display: flex;
    white-space: nowrap;
    flex-basis: calc(100% - 5em);
    width: calc(100% - 5em);
    overflow: hidden;
}
#ncc-latest-box a .marquee .marquee-item {
    font-size: 1.2rem;
    display: block;
    padding: 0 1em;
    white-space: nowrap;
    animation-name: marquee;
    animation-timing-function: linear;
    animation-duration: 10s;
    animation-iteration-count: infinite;
}
@media screen and (min-width: 1024px) {
    #ncc-latest-box a .marquee .marquee-item {
        font-size: 1.4rem;
    }
}
#ncc-latest-box article p span, #ncc-latest-box article p time {
    display: inline-block;
}
#ncc-latest-box article p span {
    font-weight: 600;
    padding-right: 2em;
}
#ncc-latest-box article p time {
    padding-right: 1em;
}
@keyframes marquee {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(-100%, 0, 0);
    }
}
/* ================================================================
   #トップ：イベントカレンダー
================================================================ */
#calendar-section {
    padding-top: 40px;
    padding-bottom: 40px;
}
/* ================================================================
   #トップ：イベントバナー
================================================================ */
#top-event-section {
    padding-top: 96px;
    overflow: hidden;
}
#top-event-section::before {
    content: "";
    background-color: #F7F7F7;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
@media screen and (min-width: 768px) {
    #top-event-section::before {
        right: 60%;
    }
}
@media screen and (min-width: 1366px) {
    #top-event-section {
        padding-top: 192px;
    }
}
#event-bnr-slider .news-item-thumb figure {
    background-color: #CCC;
    padding-top: 100%;
}
.event-bnr-item:hover .more-btn {
    background: linear-gradient(45deg, #ff6000 10%, #fff66c, #ffa36c 90%);
    background-size: 600% 600%;
    animation: AnimationName .8s ease 1 forwards;
    transform: translateY(-3px);
}
/* ================================
   #トップ：イベントバナー：スライダー
================================ */
#event-bnr-slider .slick-list {
    overflow: visible;
}
#event-bnr-slider .slick-arrow {
    background-color: #4c4d55;
    box-shadow: rgba(0, 0, 0, 0.3) 0 4px 8px -4px;
    height: 60px;
    width: 48px;
}
#event-bnr-slider .slick-arrow:hover {
    background: linear-gradient(45deg, #ff0033 10%, #fff66c, #ffa36c 90%);
    background-size: 600% 600%;
    animation: AnimationName .8s ease 1 forwards;
}
#event-bnr-slider .slick-next {
    border-radius: 2px 0 0 2px;
    right: -5vw;
}
#event-bnr-slider .slick-prev {
    border-radius: 0 2px 2px 0;
    left: -5vw;
}
#event-bnr-slider .slick-disabled {
    background-color: #F7F7F7;
}
#event-bnr-slider .slick-disabled::before {
    border-color: #CCC;
}
#event-bnr-slider .slick-disabled:hover {
    background-color: #F7F7F7;
    background-image: none;
    animation: none;
}
@media screen and (min-width: 768px) {
    #event-bnr-slider .slick-arrow {
        height: 72px;
        width: 72px;
    }
    #event-bnr-slider .slick-next {
        border-radius: 2px;
        right: 0;
    }
    #event-bnr-slider .slick-prev {
        border-radius: 2px;
        left: 0;
    }
}
#bnr-section {
    background-image: url(//www.ncc-net.ac.jp/wp/wp-content/themes/ncc_2020_theme/common/css/../img/theme/br_triangle.png);
    background-repeat: repeat;
    background-position: left center;
    background-size: 320px;
    background-color: #f7f7f7;
}
#bnr-section .event-bnr-slider-wrap {
    padding-left: 0;
    padding-right: 0;
}
@media screen and (max-width: 767px) {
    #bnr-section .wf_row {
        margin-left: -10px;
        margin-right: -10px;
    }
    #bnr-section .wf_col-100 {
        padding-left: 10px;
        padding-right: 10px;
    }
}
/* ================================================================
   #トップ：就職内定速報
================================================================ */
#job-report-section .news-item:nth-child(n+2) {
    /*display: none;*/
}
@media screen and (min-width: 768px) {
    #job-report-section .news-item:nth-child(n+2) {
        display: inherit;
    }
}
/* ================================================================
   #トップ：学科紹介
================================================================ */
@media screen and (min-width: 768px) {
    .top-course-item {
        width: 50%;
        float: left;
    }
}
@media screen and (min-width: 1366px) {
    .top-course-item {
        width: auto;
        float: none;
    }
}
.top-course-item:nth-of-type(2n) {
    flex-direction: row-reverse;
}
@media screen and (min-width: 1366px) {
    .top-course-item:nth-of-type(2n) {
        /*		margin-top: 64px;
              margin-bottom: 64px;*/
    }
}
.top-course-item:nth-of-type(6) {
    margin-bottom: 0;
}
.top-course-photo-mask {
    overflow: hidden;
}
.top-course-photo {
    /*height: 110vw;*/
    /*position: sticky;
  top: 0;
  left: 0;*/
    backface-visibility: hidden;
    overflow: hidden;
}
.top-course-photo::before {
    content: "";
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0.5) 100%);
    width: 100%;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    transition: height ease-in-out .2s, background-image ease-in-out .2s;
}
.top-course-photo figure {
    background-size: cover;
    background-position: center;
    padding-top: 110vw;
    transform: translateY(-10vw);
    transition: transform ease-out .3s;
}
@media screen and (min-width: 768px) {
    .top-course-photo figure {
        padding-top: 125%;
        transform: none;
    }
}
@media screen and (min-width: 1366px) {
    .top-course-photo {
        position: relative;
        height: auto;
    }
    .top-course-photo::before {
        display: none;
    }
    .top-course-photo figure {
        padding-top: 70%;
    }
}
.anime_is-active .top-course-photo.smork::before {
    opacity: 1;
}
.top-course-item:hover .top-course-photo figure {
    transform: translateY(-10vw) scale(1.08);
}
.top-course-item:hover .top-course-photo::before {
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0.7) 100%);
}
@media screen and (min-width: 768px) {
    .top-course-item:hover .top-course-photo figure {
        transform: none;
    }
    .top-course-item:hover .top-course-photo::before {
        background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0.7) 100%);
    }
}
#ai-system .top-course-photo figure {
    background-image: url("../img/theme/home-ai-system_sp.webp");
}
@media screen and (min-width: 768px) {
    #ai-system .top-course-photo figure {
        background-image: url("../img/theme/home-ai-system.webp");
    }
}
#information-system .top-course-photo figure {
    background-image: url("../img/theme/home-information-system_sp.webp");
}
@media screen and (min-width: 768px) {
    #information-system .top-course-photo figure {
        background-image: url("../img/theme/home-information-system.webp");
    }
}
#esports .top-course-photo figure {
    background-image: url("../img/theme/home-esports_sp.webp");
}
@media screen and (min-width: 768px) {
    #esports .top-course-photo figure {
        background-image: url("../img/theme/home-esports.webp");
    }
}
#game-creator .top-course-photo figure {
    background-image: url("../img/theme/home-game-creator_sp.webp");
}
@media screen and (min-width: 768px) {
    #game-creator .top-course-photo figure {
        background-image: url("../img/theme/home-game-creator.webp");
    }
}
#cg-web-creator .top-course-photo figure {
    background-image: url("../img/theme/home-cg-web-creator_sp.webp");
}
@media screen and (min-width: 768px) {
    #cg-web-creator .top-course-photo figure {
        background-image: url("../img/theme/home-cg-web-creator.webp");
    }
}
#character-design .top-course-photo figure {
    background-image: url("../img/theme/home-character-design_sp.webp");
}
@media screen and (min-width: 768px) {
    #character-design .top-course-photo figure {
        background-image: url("../img/theme/home-character-design.webp");
    }
}
#cource-university .top-course-photo figure {
    background-image: url("../img/theme/home-university_sp.webp");
}
@media screen and (min-width: 768px) {
    #cource-university .top-course-photo figure {
        background-image: url("../img/theme/home-university.webp");
    }
}
.information-university .top-course-photo figure {
    background-image: url("../img/theme/home-information-university_sp.webp") !important;
}
@media screen and (min-width: 768px) {
    .information-university .top-course-photo figure {
        background-image: url("../img/theme/home-information-university.webp") !important;
    }
}
#cource-university .top-course-photo figure {
    background-image: url("../img/theme/home-university_sp.webp");
}
@media screen and (min-width: 768px) {
    #cource-university .top-course-photo figure {
        background-image: url("../img/theme/home-university.webp");
    }
}
#it-career-design .top-course-photo figure {
    background-image: url("../img/theme/home-it-career-design_sp.webp");
}
@media screen and (min-width: 768px) {
    #it-career-design .top-course-photo figure {
        background-image: url("../img/theme/home-it-career-design.webp");
    }
}

.top-course-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: 5vw;
    color: #FFF;
    /*height: 110vw;*/
    margin: auto;
    position: absolute;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: 2;
    /*    &::before {
          display: none;
          content: "";
          background-color: $color_main;
          margin: auto;
          position: absolute;
          top: 90%;
          right: 0;
          bottom: -25%;
          left: 0;
          transform: skewY(-6deg);
      }*/
}
@media screen and (min-width: 768px) {
    .top-course-content {
        padding-bottom: 32px;
    }
}
@media screen and (min-width: 1366px) {
    .top-course-content {
        color: inherit;
        height: auto;
        margin: 0;
        padding-bottom: 0;
        position: relative;
        overflow: visible;
    }
    .top-course-content:nth-of-type(2) {
        margin-top: 0;
    }
    .top-course-content::before {
        display: none;
    }
}
.top-course-content h2 {
    margin-bottom: .5em;
}
.top-course-content h2 .font-eng {
    display: block;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1;
}
.top-course-content h2 .font-jp {
    display: block;
    font-size: 2.8rem;
    font-weight: 800;
}
.top-course-content h2 .font-jp small {
    display: block;
    font-size: 1.4rem;
}
.top-course-content h3 {
    color: #231815;
    font-size: 1.2em;
    margin-top: 0;
    margin-bottom: 0;
}
.top-course-content h3 span {
    line-height: .8;
    display: inline-block;
    padding: 1em 1em 1em 5vw;
    margin-top: 0;
    margin-left: -5vw;
    margin-bottom: -.5em;
}
.top-course-content h3 span:nth-of-type(2) {
    margin-top: -1.2em;
}
.top-course-content h3 span::before {
    content: "";
    background-color: #FFF;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
}
@media screen and (min-width: 768px) {
    .top-course-content h3 {
        color: #231815;
        font-size: 1.2em;
        font-feature-settings: "palt";
        margin-top: 0;
        margin-bottom: 0;
    }
    .top-course-content h3 span {
        padding: 1em 1em 1em 5vw;
        margin-top: 0;
        margin-left: -5vw;
        margin-bottom: -.5em;
    }
    .top-course-content h3 span:nth-of-type(2) {
        margin-top: -1.2em;
    }
    .top-course-content h3 span::before {
        content: "";
        background-color: #FFF;
        margin: auto;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: -1;
    }
}
@media screen and (min-width: 1366px) {
    .top-course-content h2 {
        text-align: left;
    }
    .top-course-content h2 .font-eng {
        line-height: 1;
    }
    .top-course-content h2 .font-jp {
        font-size: 2vw;
    }
    .top-course-content h2 .font-jp small {
        font-size: 1.6rem;
    }
    .top-course-content h3 {
        font-weight: 600;
        font-size: 2rem;
        text-align: left;
    }
    .top-course-content h3 span {
        background-color: transparent;
        display: inline-block;
        line-height: 1.4;
        padding: 0;
        margin-top: 0;
        margin-left: 0;
    }
    .top-course-content h3 span:nth-of-type(2) {
        margin-top: 0;
    }
    .top-course-content h3 br {
        display: none;
    }
}
@media screen and (min-width: 768px) {
    .top-course-content-inner {
        padding-left: 32px;
        padding-right: 32px;
    }
}
@media screen and (min-width: 1366px) {
    .top-course-content-inner {
        padding-left: 4.16667vw;
        padding-right: 4.16667vw;
    }
}
.top-course-job-list-ttl {
    display: none;
    font-weight: 600;
    font-size: 1.6rem;
    margin: 2em 0 .5em;
}
@media screen and (min-width: 1366px) {
    .top-course-job-list-ttl {
        display: inherit;
    }
}
.top-course-job-list {
    display: none;
}
@media screen and (min-width: 1366px) {
    .top-course-job-list {
        display: inherit;
        list-style: none;
        margin: -2px;
    }
    .top-course-job-list li {
        display: inline-block;
        float: left;
        padding: 2px;
    }
    .top-course-job-list li span {
        background-color: #ff6000;
        border-radius: 2px;
        color: #FFF;
        font-size: 1.1rem;
        line-height: 1;
        font-weight: 600;
        display: block;
        padding: 1em;
    }
}
#ai-system .top-course-job-list span {
    background-color: #c585ff;
}
#ai-system .top-course-content h2 .font-eng {
    color: #c585ff;
}
#information-system .top-course-job-list span {
    background-color: #00d3aa;
}
#information-system .top-course-content h2 .font-eng {
    color: #00d3aa;
}
#esports .top-course-job-list span {
    background-color: #ff6000;
}
#esports .top-course-content h2 .font-eng {
    color: #ff6000;
}
#game-creator .top-course-job-list span {
    background-color: #ee76ad;
}
#game-creator .top-course-content h2 .font-eng {
    color: #ee76ad;
}
#cg-web-creator .top-course-job-list span {
    background-color: #ffb808;
}
#cg-web-creator .top-course-content h2 .font-eng {
    color: #ffb808;
}
#character-design .top-course-job-list span {
    background-color: #00a040;
}
#character-design .top-course-content h2 .font-eng {
    color: #00a040;
}
#cource-university .top-course-job-list span {
    background-color: #006fbc;
}
#cource-university .top-course-content h2 .font-eng {
    color: #006fbc;
}
#it-career-design .top-course-job-list span {
    background-color: #00b9ef;
}
#it-career-design .top-course-content h2 .font-eng {
    color: #00b9ef;
}
.top-course-content .wf_btn-wrap {
    text-align: center;
    margin-top: 30px;
}
.top-course-content .wf_btn-wrap::after {
    content: "";
/*    background-color: #000;*/
    width: 200vw;
    margin: auto;
    position: absolute;
    top: 50%;
    left: -50vw;
    bottom: -5vw;
}
.top-course-content .wf_btn-wrap .more-btn {
    border-radius: 0;
    font-size: 1.4rem;
    padding: 0 5em;
    min-height: 46px;
    z-index: 2;
}

.top-course-content .wf_btn-wrap .more-btn::before {
    content: "";
    border: rgba(255, 255, 255, 0.4) solid 1px;
    margin: auto;
    position: absolute;
    top: -7px;
    right: -7px;
    bottom: -7px;
    left: -7px;
}
.top-course-content .wf_btn-wrap .more-btn::after {
    content: "";
    border-left: white solid 2px;
    border-right: white solid 2px;
    height: 50%;
    margin: auto;
    position: absolute;
    top: 0;
    right: -7px;
    bottom: 0;
    left: -7px;
}

.top-course-content .wf_btn-wrap .more-btn::after {
    border-left: #AAA solid 2px;
    border-right: #AAA solid 2px;
}

@media screen and (min-width: 1366px) {
    .top-course-content .wf_btn-wrap {
        text-align: left;
    }
    .top-course-content .wf_btn-wrap::after {
        display: none;
    }
    .top-course-content .wf_btn-wrap .more-btn {
        min-height: 56px;
        margin-left: 7px;
    }
    .top-course-content .wf_btn-wrap .more-btn::before {
        content: "";
        border: rgba(0, 0, 0, 0.15) solid 1px;
    }
}
#ai-system .top-course-content .wf_btn-wrap .more-btn {
    background-color: #c585ff;
}
#ai-system .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #c585ff 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#ai-system .top-course-content .wf_btn-wrap::after {
    background-color: #c585ff;
}
#ai-system .top-course-content::before {
    background-color: #c585ff;
}
#information-system .top-course-content .wf_btn-wrap .more-btn {
    background-color: #00d3aa;
}
#information-system .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #00d3aa 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#information-system .top-course-content .wf_btn-wrap::after {
    background-color: #00d3aa;
}
#information-system .top-course-content::before {
    background-color: #00d3aa;
}
#esports .top-course-content .wf_btn-wrap .more-btn {
    background-color: #ff6000;
}
#esports .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #ff6000 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#esports .top-course-content .wf_btn-wrap::after {
    background-color: #ff6000;
}
#esports .top-course-content::before {
    background-color: #ff6000;
}
#game-creator .top-course-content .wf_btn-wrap .more-btn {
    background-color: #ee76ad;
}
#game-creator .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #ee76ad 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#game-creator .top-course-content .wf_btn-wrap::after {
    background-color: #ee76ad;
}
#game-creator .top-course-content::before {
    background-color: #ee76ad;
}
#cg-web-creator .top-course-content .wf_btn-wrap .more-btn {
    background-color: #ffb808;
}
#cg-web-creator .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #ffb808 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#cg-web-creator .top-course-content .wf_btn-wrap::after {
    background-color: #ffb808;
}
#cg-web-creator .top-course-content::before {
    background-color: #ffb808;
}
#character-design .top-course-content .wf_btn-wrap .more-btn {
    background-color: #00a040;
}
#character-design .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #00b5ed 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#character-design .top-course-content .wf_btn-wrap::after {
    background-color: #00a040;
}
#character-design .top-course-content::before {
    background-color: #00a040;
}
#cource-university .top-course-content .wf_btn-wrap .more-btn {
    background-color: #006fbc;
}
#cource-university .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #00b5ed 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#cource-university .top-course-content .wf_btn-wrap::after {
    background-color: #006fbc;
}
#cource-university .top-course-content::before {
    background-color: #006fbc;
}

#it-career-design .top-course-content .wf_btn-wrap .more-btn {
    background-color: #00b9ef;
}
#it-career-design .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #00b5ed 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#it-career-design .top-course-content .wf_btn-wrap::after {
    background-color: #00b9ef;
}
#it-career-design .top-course-content::before {
    background-color: #00b9ef;
}

#it-ai-university .top-course-content .wf_btn-wrap .more-btn {
    background-color: #5054a2;
}
#it-ai-university .top-course-content .wf_btn-wrap .more-btn.btn-hover:hover {
    background: linear-gradient(45deg, #00b5ed 20%, #ff6000, #c585ff 80%);
    background-size: 500% 500%;
    animation: AnimationName .8s ease 1 forwards;
}
#it-ai-university .top-course-content .wf_btn-wrap::after {
    background-color: #5054a2;
}
#it-ai-universityn .top-course-content::before {
    background-color: #5054a2;
}

/* ================================================================
   #トップ：キャッチコピー
================================================================ */
.top-lead-section {
    padding-top: 96px !important;
    padding-bottom: 0 !important;
}
.top-lead-section::before {
    content: "";
    border-left: #231815 solid 2px;
    width: 0;
    height: 48px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}
.top-lead-section h2 {
    font-size: 3.6rem;
    font-weight: 800;
    font-feature-settings: "palt";
    line-height: 1.4;
    letter-spacing: .15em;
    text-align: center;
    padding-left: .1em;
    margin-bottom: .5em;
}
.top-lead-section h2 .indent {
    display: inline-block;
}
.top-lead-section h2 .font-eng {
    display: none;
    letter-spacing: 0;
    color: #EEE;
    position: absolute;
    margin: auto;
    top: -.75em;
    right: 0;
    left: 0;
    z-index: 1;
    font-weight: 900;
    font-size: 10rem;
    text-transform: uppercase;
}
.top-lead-section h2 .font-jp {
    display: block;
    z-index: 2;
}
.top-lead-section p {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 2;
    text-align: center;
    opacity: 0.6;
}
@media screen and (min-width: 768px) {
    .top-lead-section {
        padding-top: 144px !important;
    }
    .top-lead-section::before {
        height: 72px;
    }
    .top-lead-section h2 {
        font-size: 4rem;
    }
    .top-lead-section p {
        font-size: 1.6rem;
        line-height: 2;
    }
}
@media screen and (min-width: 1366px) {
    .top-lead-section h2 {
        font-size: 6rem;
    }
    .top-lead-section p {
        font-size: 1.8rem;
    }
}
/* ================================================================
   #トップ：NCCが選ばれる理由
================================================================ */
body.home #top-chosen-section .wf_container {
    max-width: calc(1380px + 1.875vw * 2);
}
.chosen-item-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-bottom: 32px;
}
.chosen-item-inner::before {
    content: "";
    background-image: url(//www.ncc-net.ac.jp/wp/wp-content/themes/ncc_2020_theme/common/css/../img/theme/br_triangle.png);
    background-repeat: repeat;
    background-position: left center;
    background-size: 320px;
    background-color: #F7F7F7;
    border-radius: 12px;
    margin: auto;
    position: absolute;
    top: 25%;
    right: 0;
    bottom: 0;
    left: 0;
}
.chosen-item-con {
    /*background-color: $color_gray;*/
    padding: 0 5vw;
    margin-bottom: 1em;
}
.chosen-item-con p {
    font-size: 1.4rem;
    font-weight: 600;
}
@media screen and (min-width: 1024px) {
    .chosen-item-con {
        padding: 0 32px;
    }
    .chosen-item-con p {
        font-size: 1.4rem;
    }
}
.chosen-ttl {
    font-size: 2rem;
    font-weight: 800;
    text-align: center;
    line-height: 1.6;
    margin: 0.2em 0;
}
@media screen and (min-width: 1366px) {
    .chosen-ttl {
        font-size: 3rem;
    }
}
.chosen-item .font-eng {
    font-size: 1.8rem;
    font-weight: 600;
    text-transform: uppercase;
}
.chosen-item .wf_btn-wrap {
    margin-top: auto;
    margin-bottom: 0;
}
.logo-slider::before {
    content: "";
    background-color: #FFF;
    border-radius: 100%;
    margin: auto;
    position: absolute;
    top: 15%;
    right: 15%;
    bottom: 15%;
    left: 15%;
}
/* ================================================================
   #トップ：施設紹介
================================================================ */
#top-facility-section {
    background-image: url("../img/theme/br_triangle.png");
    background-repeat: repeat;
    background-position: left center;
    background-size: 320px;
    background-color: #f7f7f7;
    padding-top: 0;
}
@media screen and (min-width: 768px) {
    #top-facility-section {
        background-image: none;
        background-color: transparent;
    }
}
.top-facility-photo {
    background-image: url("../img/index/photo_facility_01_pc.jpg");
    background-size: cover;
    background-position: center bottom;
    padding-top: 75%;
}
@media screen and (min-width: 768px) {
    .top-facility-photo {
        padding-top: 56.25%;
    }
}
.top-stadium-photo {
    background-image: url("../img/index/photo_facility_02_pc.jpg");
    background-size: cover;
    background-position: center bottom;
    padding-top: 75%;
}
@media screen and (min-width: 768px) {
    .top-stadium-photo {
        padding-top: 56.25%;
    }
}
.top-facility-con {
    background-color: #FFF;
    border-radius: 8px 0 0 8px;
    margin: -10vw 0 0 5vw;
    padding-top: 5vw;
    padding-bottom: 5vw;
}
.top-facility-con h3 {
    color: #ff6000;
    font-size: 2.4rem;
    line-height: 1.4;
    margin-bottom: .5em;
}
.top-facility-con p {
    margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
    .top-facility-con {
        background-color: transparent;
        max-width: auto;
        margin: auto;
        padding-top: 0;
        padding-bottom: 0;
    }
    .top-facility-con h3 {
        color: #ff6000;
        font-size: 2.4rem;
    }
    .top-facility-con p {
        line-height: 2;
    }
}
.top-facility-con .wf_btn-wrap {
    text-align: left;
}
/* ================================================================
   #トップ：ニュース
================================================================ */
.news-category-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 50px;
    margin-top: -20px;
    position: relative;
}
.news-category-nav:before,
.news-category-nav:after {display: none;}
.news-category-nav a {
    background: #a0a0a0;
    color: #fff;
    text-decoration: none;
    padding: 4px 12px 6px;
    margin-left: 8px;
    font-size: 15px;
    font-size: 1.5rem;
}
.news-category-nav a:first-child {margin-left: 0;}
.news-category-nav a:hover {background: #ff6000;}
.news-item .wf_btn-wrap::before {
    content: "";
    background-color: #FFF;
    margin: auto;
    position: absolute;
    top: -150%;
    right: 0;
    bottom: 50%;
    left: 0;
}
.news-item time {
    font-size: 1.2rem;
    display: inline-block;
    margin-bottom: .5em;
}
.news-item-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}
/*
.news-item + .news-item .news-item-inner {
    border-top: #DDD solid 1px;
    padding-top: 5vw;
}
*/
@media screen and (min-width: 768px) {
    .news-item + .news-item .news-item-inner {
        border-top: none;
        padding-top: 0;
    }
}
@media screen and (max-width: 768px) {
    .news-category-nav {
        margin-top: -10px;
        margin-bottom: 30px;
        flex-wrap: wrap;
    }
    .news-category-nav a {
        font-size: 13px;
        font-size: 1.3rem;
        margin-left: 6px;
    }
}
/* ================================
   #記事アイテム
================================ */
.news-item-content {
    background-color: #FFF;
    height: 100%;
    padding: 10px 0 5vw;
    z-index: 2;
}
@media screen and (min-width: 768px) {
    .news-item-content {
        padding: 15px 20px 20px;
    }
}
#event-bnr-slider .news-item-content {
    padding: 10px 5vw 5vw;
}
@media screen and (min-width: 768px) {
    #event-bnr-slider .news-item-content {
        padding: 15px 20px 20px;
    }
}
#event-bnr-slider .more-btn {
    border-radius: 0;
    padding: 0 6em;
    min-height: 44px;
}
#event-bnr-slider .more-btn::before {
    content: "";
    border: rgba(0, 0, 0, 0.05) solid 1px;
    margin: auto;
    position: absolute;
    top: -7px;
    right: -7px;
    bottom: -7px;
    left: -7px;
}
#event-bnr-slider .more-btn::after {
    content: "";
    border-left: #AAA solid 2px;
    border-right: #AAA solid 2px;
    margin: auto;
    position: absolute;
    top: 12px;
    right: -7px;
    bottom: 12px;
    left: -7px;
}
/* ================================
   #記事アイテム：サムネイル
================================ */
.news-item-thumb figure {
    background-size: contain;
    background-position: center;
    padding-top: 56.25%;
    overflow: hidden;
}
.news-item-thumb figure::before {
    content: "";
    background-color: rgba(0, 0, 0, 0.025);
    box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.025) inset;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
.news-item-thumb figure img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    transition: transform .2s;
    transition-timing-function: ease-out;
}
/* ================================
   #記事アイテム：タイトル・抜粋
================================ */
.news-item-cat {
    background-color: #ff6000;
    background: linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);
    border-radius: 2em;
    display: inline-block;
    color: #FFF;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 5px;
    padding: .5em 2em;
}
.news-item-cat.youtube {
    background-color: #FF0000;
    background-image: none;
}
@media screen and (min-width: 768px) {
    .news-item-cat {
        font-size: 1.2rem;
    }
}
.news-item-ttl {
    font-size: 1.6rem;
    line-height: 1.4;
    margin-bottom: 0;
}
@media screen and (min-width: 768px) {
    .news-item-ttl {
        font-size: 1.6rem;
    }
}
.news-item-excerpt {
    font-size: 1.2rem;
    margin-top: 1em;
    opacity: 0.75;
    z-index: 3;
}
@media screen and (min-width: 768px) {
    .news-item-excerpt {
        font-size: 1.4rem;
    }
}
.btn_blog-index {
    margin: 30px auto 0;
    padding: 1em;
    max-width: 320px;
}
/* Scss Document */
[class^="swiper-button-"] {
    transition: all .3s ease;
}
.swiper-slide {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
*, *:before, *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.swiper-slide {
    display: flex;
    align-items: center;
}
.swiper-container {
    width: 100%;
    height: 100%;
    float: left;
    transition: opacity .6s ease, transform .3s ease;
}
.swiper-container.nav-slider {
    width: 20%;
    padding-left: 5px;
}
.swiper-container.nav-slider .swiper-slide {
    cursor: pointer;
    opacity: .4;
    transition: opacity .3s ease;
}
.swiper-container.nav-slider .swiper-slide.swiper-slide-active {
    opacity: 1;
}
.swiper-container.nav-slider .swiper-slide .content {
    width: 100%;
}
.swiper-container.nav-slider .swiper-slide .content .title {
    font-size: 20px;
}
.swiper-container:hover .swiper-button-prev, .swiper-container:hover .swiper-button-next {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
}
.swiper-container.loading {
    opacity: 0;
    visibility: hidden;
}
.swiper-slide {
    overflow: hidden;
}
.swiper-slide .slide-bgimg {
    /*background-position: center bottom;
    background-size: cover;*/
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.swiper-slide .entity-img {
    display: none;
}
.swiper-slide .content {
    color: #231815;
    width: 100%;
    padding: 5vw;
}
.swiper-slide .content .title {
    font-size: 4.4em;
    font-weight: bold;
    letter-spacing: .1em;
    margin-bottom: 30px;
    line-height: 1;
}
.swiper-slide .content .title .font-eng {
    font-size: 2rem;
    letter-spacing: normal;
    color: #ff6000;
    text-transform: uppercase;
}
.swiper-slide .content .title .font-eng small {
    text-transform: lowercase;
}
.swiper-slide .content .caption {
    display: block;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 2.4;
    transform: translateX(50px);
    transition: opacity .3s ease, transform .7s ease;
}
.swiper-slide .content .caption.show {
    transform: translateX(0);
    opacity: 1;
}
@media screen and (min-width: 1024px) {
    .swiper-slide .content {
        padding: 25px;
    }
}
[class^="swiper-button-"] {
    width: 44px;
    opacity: 0;
    visibility: hidden;
}
.swiper-button-prev {
    transform: translateX(50px);
}
.swiper-button-next {
    transform: translateX(-50px);
}
#billboard-slider .swiper-slide .content {
    background-color: rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: #FFF;
    height: 100%;
    margin: auto 0 0;
    padding: 5vw 5vw 10vw;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}
@media screen and (min-width: 768px) {
    #billboard-slider .swiper-slide .content {
        padding: 5vw 5vw 7.5vw;
    }
}
#billboard-0 .slide-bgimg {
    background-image: url("../img/theme/210630_KV_resize_7_31_SP.jpg");
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
    #billboard-0 .slide-bgimg {
        background-image: url("../img/theme/210630_KV_resize_7_31_PC.jpg");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
}
#billboard-1 .slide-bgimg {
    background-image: url("../img/theme/kv_01_sp202103re.jpg");
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
    #billboard-1 .slide-bgimg {
        background-image: url("../img/theme/kv_01_pc202103re.jpg");
        background-size: cover;
        background-position: center bottom;
        background-repeat: no-repeat;
    }
}
#billboard-2 .slide-bgimg {
    background-image: url("../img/theme/210611_NCC_KV_SP.jpg");
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
    #billboard-2 .slide-bgimg {
        background-image: url("../img/theme/210611_NCC_KV_PC.jpg");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
}
#billboard-3 .slide-bgimg {
    background-image: url("../img/theme/kv_03_sp202103re.jpg");
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
    #billboard-3 .slide-bgimg {
        background-image: url("../img/theme/kv_03_pc202103.jpg");
        background-size: cover;
        background-position: center top;
        background-repeat: no-repeat;
    }
}
#billboard-4 .slide-bgimg {
    background-image: url("../img/theme/kv_04_sp202103re.jpg");
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
    #billboard-4 .slide-bgimg {
        background-image: url("../img/theme/kv_014_pc202103.jpg");
        background-size: cover;
        background-position: center top;
        background-repeat: no-repeat;
    }
}
.billborad-copy {
    color: #FFF;
    font-size: 4rem;
    font-weight: 800;
    font-feature-settings: "palt";
    line-height: 1.4;
    letter-spacing: .2em;
    z-index: 4;
}
.billborad-copy span {
    display: inline-block;
}
.billborad-copy .copy-hidden {
    opacity: 0;
}
@media screen and (min-width: 768px) {
    .billborad-copy {
        font-size: 5.6vw;
    }
}
.billborad-copy-min {
    color: #ff6000;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 1em;
}
.billborad-copy-min small {
    text-transform: lowercase;
}
@media screen and (min-width: 768px) {
    .billborad-copy-min {
        font-size: 2vw;
    }
}
.color-text {
    color: inherit;
}
.swiper-slide-duplicate-active .color-text {
    color: #ff6000;
    transition: color .3s;
    transition-delay: 1s;
}
/* ================================================================
   #ページ：学科紹介
================================================================ */
/* Scss Document */
.col-item {
    margin-bottom: 40px;
}
.photo-box {
    margin-right: -5vw;
    margin-left: -5vw;
    overflow: hidden;
}
.photo-box figure {
    width: 100%;
    padding-top: 56.25%;
}
.photo-box figure img {
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
@media screen and (min-width: 768px) {
    .photo-box {
        margin-right: 0;
        margin-left: 0;
    }
}
.rellax {
    will-change: transform;
}
.course-scetion-ttl {
    font-size: 3.2rem;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 1.5em;
}
.course-scetion-ttl .font-eng {
    display: block;
}
.course-scetion-ttl .font-jp {
    font-size: 1.6rem;
    display: block;
    margin-top: 1em;
}
@media screen and (min-width: 1024px) {
    .course-scetion-ttl {
        font-size: 3.6rem;
        margin-bottom: 100px;
    }
    .course-scetion-ttl .font-eng {
        font-size: 4rem;
        letter-spacing: .1em;
    }
    .course-scetion-ttl .font-jp {
        font-size: 1.8rem;
    }
}
/* ================================================================
   #ページ：キービジュアル
================================================================ */
.page-header {
    color: #FFF;
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    height: 100vw;
}
.page-header.min {
    max-height: 75vw;
}
@media screen and (min-width: 768px) {
    .page-header {
        max-height: 56.25vw;
    }
    .page-header.min {
        max-height: 56.25vw;
    }
}
@media screen and (min-width: 1024px) {
    .page-header {
        max-height: 56.25vw;
    }
    .page-header.min {
        min-height: 400px;
        max-height: 480px;
    }
}
@media screen and (min-width: 1024px) {
    .page-header {
        max-height: 80vh;
    }
}
/* ================================
   #ページ：キービジュアル：コンテンツ
================================ */
.page-header-photo-wrap {
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}
.page-header-photo-wrap .page-header-photo-mask {
    margin: auto;
    position: absolute;
    top: -10%;
    right: 0;
    bottom: -10%;
    left: 0;
}
.page-header-photo-wrap .page-header-photo {
    background-size: cover;
    background-position: center;
    height: 100%;
}
#ai-system .page-header-photo {
    background-image: url("../img/theme/photo_main_opencampus_pc.jpg");
}
#opencampus .page-header-photo {
    background-image: url("../img/theme/photo_main_opencampus_pc.jpg");
}
#ao .page-header-photo {
    background-image: url("../img/theme/photo_main_opencampus_pc.jpg");
}
#examination .page-header-photo {
    background-image: url("../img/theme/photo_main_opencampus_pc.jpg");
}
#basic-information .page-header-photo {
    background-image: url("../img/theme/photo_main_opencampus_pc.jpg");
}
/* ================================
   #ページ：キービジュアル：アニメーションレイヤー
================================ */
.anime-layer-wrap {
    background-color: rgba(48, 48, 48, 0);
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.anime-layer-wrap .anime-layer {
    background-color: #ff6000;
    height: 100%;
    width: 200%;
    transform: translateX(-100%);
}
.js_is-active .anime-layer-wrap {
    background-color: rgba(48, 48, 48, 0.5);
    transition: background-color .4s;
    transition-delay: 2s;
}
.js_is-active .anime-layer-wrap .anime-layer {
    transform: translateX(100%);
    transition: transform 5s;
}
/* ================================
   #ページ：キービジュアル：コンテンツ
================================ */
.page-header-content {
    display: flex;
    align-items: flex-end;
    margin: auto;
    padding-bottom: 30px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
}
.page-header-content .reason-lead {
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0.02em;
}
#coures-header-info .font-eng {
    line-height: 1;
    text-transform: uppercase;
    font-size: 1.8rem;
}
#coures-header-info .font-eng small {
    font-size: 75%;
    text-transform: lowercase;
}
#coures-header-info .font-jp {
    font-size: 2.4rem;
    margin-top: 5px;
}
#coures-header-info .page-header-copy {
    font-size: 2.8rem;
}
#coures-header-info .page-header-copy strong.icon {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    border-radius: 65px;
    background: #fff;
    color: #ff6000;
    vertical-align: text-bottom;
    width: 65px;
    height: 65px;
    line-height: 65px;
    font-size: 70%;
    text-align: center;
}
#coures-header-info .page-header-copy-eng {
    font-size: 1.2rem;
    font-weight: normal;
    line-height: 1.4;
    margin-top: 1em;
    opacity: 0.5;
}
#coures-header-info dl {
    display: flex;
    flex-wrap: wrap;
    font-weight: 600;
    font-size: 1.4rem;
    margin-top: 1em;
}
#coures-header-info dl dt {
    border: #FFF solid 2px;
    padding: .5em;
}
#coures-header-info dl dd {
    border: #FFF solid 2px;
    padding: .5em;
    margin-left: -2px;
}
@media screen and (min-width: 768px) {
    #coures-header-info {
        padding-bottom: 5vw;
    }
    #coures-header-info .font-jp {
        font-size: 5.6rem;
    }
    #coures-header-info .page-header-copy {
        font-size: 4.8rem;
    }
    #coures-header-info dl {
        font-size: 1.8rem;
    }
    #coures-header-info dl dt {
        padding: .5em 1em;
    }
    #coures-header-info dl dd {
        padding: .5em 1em;
    }
}
.mext-box {
    background-color: #231815;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    position: absolute;
    right: 5vw;
    bottom: 5vw;
    left: 5vw;
    z-index: 3;
    padding: 5vw;
}
.mext-box h3 {
    font-size: 1.4rem;
    margin-bottom: 1em;
}
.mext-box p {
    font-size: 1rem;
}
@media screen and (min-width: 768px) {
    .mext-box {
        width: 35%;
        right: 0;
        bottom: 0;
        left: auto;
        padding: 30px;
        transform: translateY(50%);
    }
    .mext-box h3 {
        font-size: 1.6rem;
    }
    .mext-box p {
        font-size: 1.4rem;
    }
}
.coures-side-phot {
    background-color: #231815;
    width: 20%;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
}
/* ================================
   #学科紹介：学科リンク
================================ */
.department-voice-btn {
    margin-top: 30px;
    border-bottom: 1px solid #eee;
    padding-bottom: 30px;
}
.department-nav-wrap {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.department-nav-wrap.twice {
    padding-top: 40px !important;
}
.department-nav {
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    margin-bottom: 25px;
}
.department-nav li {
    width: 48%;
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.department-nav li:nth-child(2n-1) {
    padding-left: 15px;
}
.department-nav li:nth-child(2n) {
    padding-right: 15px;
}
.department-nav li a {
    display: block;
    text-align: center;
    font-size: 18px;
    line-height: 160%;
    font-weight: bold;
    color: #fff;
    background: #ff6000;
    padding: 8px;
    position: relative;
}
.department-nav li strong {
    color: #ffeb00;
    font-weight: normal;
}
.department-nav li a:before {
    display: block;
    content: "";
    position: absolute;
    border-top: 22px solid transparent;
    border-bottom: 22px solid transparent;
    top: 50%;
    margin-top: -22px;
}
.department-nav li:nth-child(2n-1) a:before {
    border-right: 15px solid #ff6000;
    left: -15px;
}
.department-nav li:nth-child(2n) a:before {
    border-left: 15px solid #ff6000;
    right: -15px;
}
.department-nav li a.character-design {background: #00a040;}
.department-nav li:nth-child(2n-1) a.character-design:before {border-right-color: #00a040;}
.department-nav li:nth-child(2n) a.character-design:before {border-left-color: #00a040;}

.department-nav li a.ai-system {background: #c585ff;}
.department-nav li:nth-child(2n-1) a.ai-system:before {border-right-color: #c585ff;}
.department-nav li:nth-child(2n) a.ai-system:before {border-left-color: #c585ff;}

.department-nav li a.information-system {background: #00d3aa;}
.department-nav li:nth-child(2n-1) a.information-system:before {border-right-color: #00d3aa;}
.department-nav li:nth-child(2n) a.information-system:before {border-left-color: #00d3aa;}

.department-nav li a.game-creator {background: #ee76ad;}
.department-nav li:nth-child(2n-1) a.game-creator:before {border-right-color: #ee76ad;}
.department-nav li:nth-child(2n) a.game-creator:before {border-left-color: #ee76ad;}

.department-nav li a.esports {background: #ff6000;}
.department-nav li:nth-child(2n-1) a.esports:before {border-right-color: #ff6000;}
.department-nav li:nth-child(2n) a.esports:before {border-left-color: #ff6000;}

.department-nav li a.cg-web-creator {background: #ffb808;}
.department-nav li:nth-child(2n-1) a.cg-web-creator:before {border-right-color: #ffb808;}
.department-nav li:nth-child(2n) a.cg-web-creator:before {border-left-color: #ffb808;}

.department-nav li a.it-expert {background: #00b5ed;}
.department-nav li:nth-child(2n-1) a.it-expert:before {border-right-color: #00b5ed;}
.department-nav li:nth-child(2n) a.it-expert:before {border-left-color: #00b5ed;}

.department-nav.oc-nav {
    /*flex-wrap: wrap;*/
}
.department-nav.oc-nav li {
    /*margin-bottom: 15px;*/
    display: flex;
    flex: 1;
    margin-left: 15px;
}
.department-nav.oc-nav li:first-child {
    margin-left: 0;
}
.department-nav.oc-nav li a {
    display: flex;
    line-height: 140%;
    align-items: center;
    justify-content: center;
    flex: 1;
}
.department-nav.oc-nav li:nth-child(2n) {
    padding-right: 0;
}
.department-nav.oc-nav li:nth-child(2n-1) {
    padding-left: 0;
}
.department-nav.oc-nav li:nth-child(2n) a:before,
.department-nav.oc-nav li:nth-child(2n-1) a:before {
    display: none;
}
#footer-sticky-nav.department-btn {
    position: static;
    width: 100%;
    display: block;
}
#footer-sticky-nav.department-btn .sticky-nav-heishu {
    transform: translate3d(0, 0, 0);
    box-shadow: rgba(144, 54, 0, .3) 0px 1px 2px 0px, rgba(144, 54, 0, .15) 0px 2px 4px 0px;
}
@media screen and (max-width: 768px) {
    .department-nav {
        margin-left: 10px;
        margin-right: 10px;
    }
    .department-nav li:nth-child(1) {
        padding-left: 10px;
    }
    .department-nav li:nth-child(2) {
        padding-right: 10px;
    }
    .department-nav li a {
        font-size: 15px;
        padding: 4px;
    }
    .department-nav li a:before {
        border-top-width: 16px;
        border-bottom-width: 16px;
        margin-top: -16px;
    }
    .department-nav li:nth-child(1) a:before {
        border-right-width: 10px;
        left: -10px;
    }
    .department-nav li:nth-child(2) a:before {
        border-left-width: 10px;
        right: -10px;
    }
    .department-nav.reason-nav,
    .department-nav.oc-nav {
        flex-direction: column;
    }
    .department-nav.reason-nav li,
    .department-nav.oc-nav li {
        width: auto;
    }
    .department-nav.oc-nav li a {
        padding-top: 8px;
        padding-bottom: 8px;
    }
    .department-nav.oc-nav li {
        margin-bottom: 0;
    }
    .department-nav.reason-nav li:nth-child(2n-1){
        margin-right: 10px;
        padding-left: 10px;
    }
    .department-nav.reason-nav li:nth-child(2n) {
        margin-left: 10px;
        padding-right: 10px;
    }
    .department-nav.reason-nav li + li,
    .department-nav.oc-nav li + li {
        margin-top: 10px;
    }
    .department-nav.oc-nav li + li {
        margin-left: 0;
    }
    .department-nav.reason-nav li a,
    .department-nav.oc-nav li a {
        font-size: 14px;
    }
    .department-nav.oc-nav li a:before {
        display: none;
    }
}
/* ================================
   #学科紹介：イントロ
================================ */
.course-intoro {
    font-size: 2rem;
}
@media screen and (min-width: 768px) {
    .course-intoro {
        font-size: 2.8rem;
    }
}
.course-intoro-txt {
    font-size: 1.4rem;
    line-height: 1.8;
    margin-bottom: 32px;
}
@media screen and (min-width: 768px) {
    .course-intoro-txt {
        font-size: 1.6rem;
    }
}
/* ================================
   #学科紹介：目指す職業・検定・資格
================================ */
#course-qualification {
    padding-top: 48px;
    padding-bottom: 48px;
}
#course-qualification h3 {
    background-color: #c585ff;
    border-radius: 4px;
    padding: .5em 1em;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#course-qualification h3.ai-system {
    background-color: #c585ff;
}
#course-qualification h3.character-design {
    background-color: #00a040;
}
#course-qualification h3.information-system {
    background-color: #00d3aa;
}
#course-qualification h3.game-creator {
    background-color: #ee76ad;
}
#course-qualification h3.esports {
    background-color: #ff6000;
}
#course-qualification h3.cg-web-creator {
    background-color: #ffb808;
}
#course-qualification h3.it-expert {
    background-color: #00b5ed;
}
#course-qualification h3.it-expert-4years {
    background-color: #006FBC;
}
#course-qualification h3.ai-system-2024 {
    background-color: #c585ff;
}
#course-qualification h3.character-design-2024 {
    background-color: #00a040;
}
#course-qualification h3.information-system-2024 {
    background-color: #00d3aa;
}
#course-qualification h3.game-creator-2024 {
    background-color: #ee76ad;
}
#course-qualification h3.esports-2024 {
    background-color: #ff6000;
}
#course-qualification h3.cg-web-creator-2024 {
    background-color: #ffb808;
}
#course-qualification h3.it-expert-2024 {
    background-color: #00b5ed;
}
#course-qualification h3.it-expert-4years-2024 {
    background-color: #006FBC;
}
@media screen and (min-width: 768px) {
    #course-qualification h3 {
        font-size: 2rem;
    }
}
.qualification-list-wrap {
    background-color: #FFF;
    padding: 5vw;
    margin-right: -5vw;
}
@media screen and (min-width: 768px) {
    .qualification-list-wrap {
        padding: 24px;
        margin-right: 0;
    }
}
.qualification-list {
    margin-top: -.5em;
    margin-left: -1em;
}
.qualification-list li {
    font-size: 1.2rem;
    float: left;
    margin-top: .5em;
}
@media screen and (min-width: 1024px) {
    .qualification-list li {
        font-size: 1.4rem;
        width: 50%;
    }
}
#course-qualification .esports li::before {
    background-color: #ff6000;
}
#course-qualification .ai-system li::before {
    background-color: #c585ff;
}
#course-qualification .information-system li::before {
    background-color: #00d3aa;
}
#course-qualification .game-creator li::before {
    background-color: #ee76ad;
}
#course-qualification .cg-web-creator li::before {
    background-color: #ffb808;
}
#course-qualification .it-expert li::before {
    background-color: #00b5ed;
}
#course-qualification .esports-2024 li::before {
    background-color: #ff6000;
}
#course-qualification .ai-system-2024 li::before {
    background-color: #c585ff;
}
#course-qualification .information-system-2024 li::before {
    background-color: #00d3aa;
}
#course-qualification .game-creator-2024 li::before {
    background-color: #ee76ad;
}
#course-qualification .cg-web-creator-2024 li::before {
    background-color: #ffb808;
}
#course-qualification .it-expert-2024 li::before {
    background-color: #00b5ed;
}
#course-qualification .it-expert-4years-2024 li::before {
    background-color: #006FBC;
}
/* ================================
   #学科紹介：学科コース紹介
================================ */
#course-section {
    overflow: hidden;
}
#course-tab {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding-left: 5vw;
    z-index: 2;
}
#course-tab .js_tab-swicth {
    background-color: #DDD;
    border-radius: 8px 8px 0 0;
    min-width: 40%;
    margin-bottom: -1px;
    overflow: hidden;
}
#course-tab .js_tab-swicth a {
    font-size: 1.4rem;
    font-weight: 600;
    display: block;
    text-align: center;
    padding: 1em 2em .5em;
    opacity: 0.4;
}
#course-tab .js_tab-swicth + .js_tab-swicth {
    margin-left: -2em;
}
#course-tab .js_tab-swicth.js_is-active {
    background-color: #F7F7F7;
}
#course-tab .js_tab-swicth.js_is-active a {
    opacity: 1;
}
@media screen and (min-width: 768px) {
    #course-tab {
        padding-left: 30px;
    }
    #course-tab .js_tab-swicth {
        min-width: 20%;
    }
    #course-tab .js_tab-swicth a {
        font-size: 1.6rem;
    }
}
#course-tab-panel {
    padding: 40px 5vw;
}
#course-tab-panel::before {
    content: "";
    background-color: #F7F7F7;
    display: block;
    width: 200%;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
}
#course-tab-panel img {
    width: 25%;
    position: absolute;
    right: 0;
    /* top: 0; */
    margin: auto;
    bottom: 40px;
}
#course-tab-panel .col-item {
    margin-bottom: 32px;
}
@media screen and (min-width: 768px) {
    #course-tab-panel {
        padding: 40px;
    }
}
.coures-info-item h3 {
    font-size: 1.6rem;
    margin-bottom: .5em;
}
.coures-info-item h3 .font-eng {
    display: block;
    font-size: 1rem;
    font-weight: normal;
}
.coures-info-item dt {
    background-color: #231815;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    width: 4em;
    height: 4em;
    float: left;
    margin-right: 1em;
}
.coures-info-item dd {
    overflow: hidden;
}
@media screen and (min-width: 768px) {
    .coures-info-item h3 {
        font-size: 1.8rem;
    }
}
.character-design .coures-info-item h3 .font-eng {
    color: #00a040;
}
.character-design .coures-info-item dt {
    background-color: #00a040;
}
.esports .coures-info-item h3 .font-eng {
    color: #ff6000;
}
.esports .coures-info-item dt {
    background-color: #ff6000;
}
.ai-system .coures-info-item h3 .font-eng {
    color: #c585ff;
}
.ai-system .coures-info-item dt {
    background-color: #c585ff;
}
.information-system .coures-info-item h3 .font-eng {
    color: #00d3aa;
}
.information-system .coures-info-item dt {
    background-color: #00d3aa;
}
.game-creator .coures-info-item h3 .font-eng {
    color: #ee76ad;
}
.game-creator .coures-info-item dt {
    background-color: #ee76ad;
}
.cg-web-creator .coures-info-item h3 .font-eng {
    color: #ffb808;
}
.cg-web-creator .coures-info-item dt {
    background-color: #ffb808;
}
.it-expert .coures-info-item h3 .font-eng {
    color: #00b5ed;
}
.it-expert .coures-info-item dt {
    background-color: #00b5ed;
}
.character-design-2024 .coures-info-item h3 .font-eng {
    color: #00a040;
}
.character-design-2024 .coures-info-item dt {
    background-color: #00a040;
}
.esports-2024 .coures-info-item h3 .font-eng {
    color: #ff6000;
}
.esports-2024 .coures-info-item dt {
    background-color: #ff6000;
}
.ai-system-2024 .coures-info-item h3 .font-eng {
    color: #c585ff;
}
.ai-system-2024 .coures-info-item dt {
    background-color: #c585ff;
}
.information-system-2024 .coures-info-item h3 .font-eng {
    color: #00d3aa;
}
.information-system-2024 .coures-info-item dt {
    background-color: #00d3aa;
}
.game-creator-2024 .coures-info-item h3 .font-eng {
    color: #ee76ad;
}
.game-creator-2024 .coures-info-item dt {
    background-color: #ee76ad;
}
.cg-web-creator-2024 .coures-info-item h3 .font-eng {
    color: #ffb808;
}
.cg-web-creator-2024 .coures-info-item dt {
    background-color: #ffb808;
}
.it-expert-2024 .coures-info-item h3 .font-eng {
    color: #00b5ed;
}
.it-expert-2024 .coures-info-item dt {
    background-color: #00b5ed;
}
.it-expert-4years-2024 .coures-info-item h3 .font-eng {
    color: #006FBC;
}
.it-expert-4years-2024 .coures-info-item dt {
    background-color: #006FBC;
}
/* ================================
   #学科紹介：学科ポイント
================================ */
#section-course-point {
    padding-top: 0;
    padding-bottom: 0;
}
.course-point-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.course-point-wrap .course-point-photo {
    flex-basis: 100%;
    width: 100%;
    z-index: 2;
}
.course-point-wrap .course-point-content {
    flex-basis: 100%;
    width: 100%;
    padding: 0;
}
@media screen and (min-width: 1024px) {
    .course-point-wrap .course-point-photo {
        flex-basis: 55%;
        width: 55%;
    }
    .course-point-wrap .course-point-content {
        flex-basis: 45%;
        width: 45%;
        padding: 0;
    }
}
.course-point-content-inner {
    margin-left: 0;
    padding-top: 20px;
    padding-bottom: 80px;
}
.course-point-content-inner h3 {
    border-bottom: #231815 solid 1px;
    padding-bottom: 10px;
    line-height: 1.4;
}
.course-point-content-inner .font-eng {
    font-size: 80%;
    display: inline-block;
    line-height: 1;
    margin-bottom: 10px;
}
.course-point-content-inner .font-jp {
    display: block;
}
.course-point-content-inner h4 {
    margin-top: 1.5rem;
    margin-bottom: .5em;
}
.course-point-content-inner small {
    display: block;
    font-size: 1rem;
    text-align: right;
    margin-top: 10px;
}
@media screen and (min-width: 1024px) {
    .course-point-content-inner {
        width: 80%;
    }
    .course-point-content-inner h3 {
        font-size: 2.8rem;
    }
    .course-point-content-inner h4 {
        margin-top: 3rem;
        margin-bottom: .5em;
    }
}
/* ================================
   #学科紹介：学科スライダー
================================ */
.course-point-slider-nav {
    position: absolute;
    bottom: 0;
    right: 5vw;
}
.course-point-slider-nav .slick-arrow {
    position: relative;
    float: left;
    height: 40px;
    width: 40px;
}
@media screen and (min-width: 1024px) {
    .course-point-slider-nav {
        padding-left: calc(55% - 60px);
        margin-top: 30px;
        right: inherit;
        left: 0;
    }
    .course-point-slider-nav .slick-arrow {
        height: 60px;
        width: 60px;
    }
}
/* ================================
   #学科紹介：カリキュラム
================================ */
#course-curricurum {
    padding-top: 0;
    padding-bottom: 0;
}
#course-curricurum .photo-box {
    box-shadow: #F7F7F7 12px 12px 0;
}
@media screen and (min-width: 768px) {
    .curricurum-item:nth-of-type(2), .curricurum-item:nth-of-type(4), .curricurum-item:nth-of-type(6) {
        transform: translateY(-64px);
    }
}
.curricurum-txt-wrap {
    background-color: #FFF;
    padding: 0 0 5vw 5vw;
}
.curricurum-txt-wrap h4 {
    background-color: #FFF;
    display: inline-block;
    font-size: 1.6rem;
    padding: 1em 2em 0 5vw;
    margin: 0;
    margin-left: -5vw;
    top: -2.3em;
}
.curricurum-txt-wrap h4 small {
    display: block;
    font-weight: 400;
    font-size: 1rem;
}
.curricurum-txt-wrap p {
    font-size: 1.4rem;
    margin-top: -1.6em;
}
@media screen and (min-width: 768px) {
    .curricurum-txt-wrap {
        padding: 0 0 20px 20px;
    }
    .curricurum-txt-wrap h4 {
        font-size: 1.6rem;
        padding: 1em 4em 0 20px;
        margin-left: -20px;
    }
}
#ai-system .curricurum-txt-wrap h4 small {
    color: #c585ff;
}
#character-design .curricurum-txt-wrap h4 small {
    color: #00a040;
}
#information-system .curricurum-txt-wrap h4 small {
    color: #00d3aa;
}
#game-creator .curricurum-txt-wrap h4 small {
    color: #ee76ad;
}
#esports .curricurum-txt-wrap h4 small {
    color: #ff6000;
}
#ai-system-2024 .curricurum-txt-wrap h4 small {
    color: #c585ff;
}
#character-design-2024 .curricurum-txt-wrap h4 small {
    color: #00a040;
}
#information-system-2024 .curricurum-txt-wrap h4 small {
    color: #00d3aa;
}
#game-creator-2024 .curricurum-txt-wrap h4 small {
    color: #ee76ad;
}
#esports-2024 .curricurum-txt-wrap h4 small {
    color: #ff6000;
}
#cg-web-creator-2024 .curricurum-txt-wrap h4 small {
    color: #ffb808;
}
#it-expert-2024 .curricurum-txt-wrap h4 small {
    color: #00b5ed;
}
#it-expert-4years-2024 .curricurum-txt-wrap h4 small {
    color: #006FBC;
}
#information-system #support-voice {
    background-color: #00d3aa;
}
#game-creator #support-voice {
    background-color: #ee76ad;
}
#esports #support-voice {
    background-color: #ff6000;
}
#cg-web-creator #support-voice {
    background-color: #ffb808;
}
#it-expert #support-voice {
    background-color: #00b5ed;
}
.curricurum-people {
    display: none;
}
/* --- 大学併修科の吹き出しはここから --*/
div.fukidashi {
    width:100%;
    position: relative;
    padding: 0.8rem 0;
    margin-bottom: 75px;
    border-bottom: 5px solid;
    color: #666;
    font-weight: bold;
    font-size: 26px;
    text-align: center;
}
div.fukidashi:before,
div.fukidashi:after {
    position: absolute;
    top: 100%;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
}
div.fukidashi:before {
    border: 16px solid;
    border-color: transparent;
    border-top-color: #666;
    margin-left: -16px;
}
div.fukidashi:after {
    border: 10px solid;
    border-color: transparent;
    border-top-color: white;
    margin-left: -10px;
}
/* --- 大学併修科の吹き出しはここまで --*/

@media screen and (min-width: 1366px) {
    .curricurum-people {
        display: block;
        height: 480px;
        width: auto;
        position: absolute;
        bottom: 0;
        left: 0;
    }
}
/* ================================
   #学科紹介：学生の声
================================ */
/* --- 2024年度年次更新ここから --*/
#ai-system-2024 #support-voice {
    background-color: #c585ff;
}
#character-design-2024 #support-voice {
    background-color: #00a040;
}
#information-system-2024 #support-voice {
    background-color: #00d3aa;
}
#game-creator-2024 #support-voice {
    background-color: #ee76ad;
}
#esports-2024 #support-voice {
    background-color: #111217;
}
#cg-web-creator-2024 #support-voice {
    background-color: #ffb808;
}
#it-expert-2024 #support-voice {
    background-color: #00b5ed;
}
#it-expert-4years-2024 #support-voice {
    background-color: #006FBC;
}
.mt12 {
    margin-top: 12px;
}
.pic-pos {
    font-weight: 400;
}
.mt24 {
    margin-top:24px;
}
.hexagon {
  width: 30px;
  height: 53px;
  background: #000;
  position: relative;
}
#esports-2024 .hexagon {
    background: #ff6000;
}
.hexagon_cont {
  height: 100%;
  font-size: 12px;
  font-weight: normal;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
}
.hexagon::before,
.hexagon::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #000;
  z-index: 0;
}
#esports-2024 .hexagon::before,
#esports-2024 .hexagon::after {
    background: #ff6000;
}
.hexagon::before {
  transform: rotate(60deg);
}
.hexagon::after {
  transform: rotate(-60deg);
}
.voice-container {
    height:53px;
    display:table;
    padding-left: 20px;
}
.voice-name-2024 {
    display:table-cell;
    vertical-align:middle;
}
.support-voice-con-2024 .course-voice-name {
    margin-top: 0rem !Important;
    margin-bottom: 0rem !Important;
}
.voice-name-2024 {
    padding-left:20px;
}
/* --- 2024年度年次更新ここまで --*/

#ai-system #support-voice {
    background-color: #c585ff;
}
#character-design #support-voice {
    background-color: #00a040;
}
#information-system #support-voice {
    background-color: #00d3aa;
}
#game-creator #support-voice {
    background-color: #ee76ad;
}
#esports #support-voice {
    background-color: #111217;
}
#cg-web-creator #support-voice {
    background-color: #ffb808;
}
#it-expert #support-voice {
    background-color: #00b5ed;
}
.support-voice-con {
    padding-top: 48px;
    color: #FFF;
}
.support-voice-con h2 {
    color: #231815;
    margin-left: -5vw;
    margin-bottom: .5em;
}
.support-voice-con h2 span {
    background-color: #FFFF4D;
    border-radius: 0 2em 2em 0;
    display: inline-block;
    font-size: 1.6rem;
    margin-bottom: 1;
    padding: .5em 1em .5em 5vw;
}
.wf_container-2024 .support-voice-photo {
    padding-top: 0 !important;
}
#support-voice .wf_container-2024 {
    padding-bottom: 48px !important;
}
.support-voice-con h2 span::before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: #FFFF4D transparent transparent transparent;
    margin: auto;
    position: absolute;
    bottom: -10px;
    right: 0;
    left: 0;
}
.support-voice-con h3 {
    font-size: 2rem;
}
.support-voice-con p {
    margin-top: 1em;
}
.support-voice-con .course-voice-txt {
    font-size: 1.4rem;
    margin-top: 2rem;
}
.support-voice-con .course-voice-name {
    font-size: 1.4rem;
    font-weight: 600;
}
.support-voice-con-2024 p {
    margin-top: 0.5em !Important;
}
.support-voice-con-2024 .course-voice-txt {
    margin-top: 0.5rem !Important;
}
.support-voice-con-2024 .course-voice-name {
    margin-top:0.5rem !Important;
    margin-bottom: 2rem !Important;
}
.support-voice-con-2024 h2 {
    margin: 12px 0 12px 0;
}
.support-voice-con-2024 h2 img {
    max-width: 75%;
    margin: 0 auto;
}
.support-voice-con .course-voice-name small {
    display: block;
}
.support-voice-con .course-voice-name .nemo {
    margin-top: 10px;
}
.support-voice-con .voice-prof {
    border-top: #FFF solid 1px;
    font-weight: normal;
    font-size: 1.4rem;
    display: block;
    margin-top: 10px;
    padding-top: 10px;
}
@media screen and (min-width: 768px) {
    .support-voice-con {
        padding-top: 0;
    }
    .support-voice-con h2 {
        margin-left: 0;
    }
    .support-voice-con h2 span {
        border-radius: 2em;
        padding: .5em 1em;
    }
    .support-voice-con h3 {
        font-size: 2.4rem;
    }
    .support-voice-con .course-voice-name {
        font-size: 1.8rem;
    }
    .support-voice-con-2024 h2 img {
        max-width: 100%;
    }
    .pic-pos {
        font-size: 80%;
    }
}
.support-voice-photo {
    padding-top: 24px;
}
.support-voice-photo img {
    margin: auto;
}
.support-voice-photo-2024-one {
    padding: 0;
}
.support-voice-photo-2024 img {
    border: 9px solid rgb(255,255,255);
}
.support-voice-photo-2024-one img.one {
    border: none;
}
.achievement-title {
  font-size: 110%;
  display: flex;
  align-items: center; /* 垂直中心 */
  justify-content: center; /* 水平中心 */
}
.achievement-title:before, .achievement-title:after {
  border-top: 1px solid;
  content: "";
  width: 2em; /* 線の長さ */
}
.achievement-title:before {
  margin-right: 1em; /* 文字の右隣 */
}
.achievement-title:after {
  margin-left: 1em; /* 文字の左隣 */
}
.achievement {
  display:flex;
}
.qualification-box,
.contest-box {
  width:50%;
}
.qualification-box p,
.contest-box p {
  text-align: center;
}
.achievement h4 {
  font-size: 110%;
  padding: 0.5rem 3rem;
  -webkit-transform: skew(-15deg);
  transform: skew(-15deg);
  color: #fff;
  background-image: -webkit-gradient(linear, left top, right top, from(#209cff), to(#1e90ff));
  background-image: -webkit-linear-gradient(left, #209cff 0%, #1e90ff 100%);
  background-image: linear-gradient(to right, #209cff 0%, #1e90ff 100%);
}
@media screen and (min-width: 768px) {
    #support-voice .wf_container-2024 {
      padding: 32px 0 48px !important;
    }
    .support-voice-photo {
        padding-top: 64px;
    }
    .support-voice-photo img {
        max-width: 100%;
    }
    .support-voice-con-itex {
      padding: 0 !important;
    }
    .achievement-title:before, .achievement-title:after {
      width: 5em; /* 線の長さ */
    }
}
.support-voice-photo-2024-itex {
  max-width: 70%;
  margin: auto;
}
/* ================================
   #学科紹介：タイムテーブル
================================ */
#section-couse-time {
    padding-top: 0;
}
.course-time-table-ttl {
    font-size: 1.6rem;
    margin-bottom: .5em;
}
.course-time-table-ttl small {
    font-size: 1.2rem;
}
@media screen and (min-width: 1024px) {
    .course-time-table-ttl {
        font-size: 1.8rem;
    }
    .course-time-table-ttl small {
        font-size: 1.4rem;
    }
}
.course-time-table {
    background-color: #FFF;
    border-color: #EEE;
    font-size: 1rem;
    text-align: center;
}
.course-time-table th {
    background-color: #231815;
    border-top: none;
    border-bottom: none;
    border-color: #FFF;
    color: #FFF;
    font-size: 1.4rem;
    padding: 0.8em;
}
.course-time-table tr:nth-of-type(2) td {
    border-top: none;
}
.course-time-table th:nth-of-type(1), .course-time-table td:nth-of-type(1) {
    width: 12em;
}
.course-time-table th:last-of-type, .course-time-table td:last-of-type {
    /*border-right: none;*/
}
@media screen and (min-width: 1024px) {
    .course-time-table {
        font-size: 1.2rem;
    }
}
.esports .course-time-table th {
    background-color: #ff6000;
}
.character-design .course-time-table th {
    background-color: #00a040;
}
.ai-system .course-time-table th {
    background-color: #c585ff;
}
.information-system .course-time-table th {
    background-color: #00d3aa;
}
.game-creator .course-time-table th {
    background-color: #ee76ad;
}
.cg-web-creator .course-time-table th {
    background-color: #ffb808;
}
.it-expert .course-time-table th {
    background-color: #00b5ed;
}
.esports-2024 .course-time-table th {
    background-color: #ff6000;
}
.character-design-2024 .course-time-table th {
    background-color: #00a040;
}
.ai-system-2024 .course-time-table th {
    background-color: #c585ff;
}
.information-system-2024 .course-time-table th {
    background-color: #00d3aa;
}
.game-creator-2024 .course-time-table th {
    background-color: #ee76ad;
}
.cg-web-creator-2024 .course-time-table th {
    background-color: #ffb808;
}
.it-expert-2024 .course-time-table th {
    background-color: #00b5ed;
}
.it-expert-4years-2024 .course-time-table th {
    background-color: #006FBC;
}
/* ================================================================
   #ページ：AO入試
================================================================ */
/* ================================
   #ページ：AO入試：メリット
================================ */
.merit-ttl {
    color: #EA5413;
    font-size: 2.4rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 0;
}
/* ================================
   #ページ：AO入試：フローチャート
================================ */
.ao-flow {
    background: -webkit-linear-gradient(-180deg, #f7b42c, #ff6000);
    border-radius: 6px;
    transform: translate3d(0, 40px, 0);
    opacity: 0;
    transition: opacity .2s, transform ease-out .2s;
}
.ao-flow::before {
    content: "";
    background-color: #FFF;
    border-radius: 4px;
    display: block;
    margin: auto;
    position: absolute;
    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
}
.ao-flow dt {
    color: #ff6000;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8em;
    font-weight: 600;
    width: 20%;
    margin: auto;
    padding: 0 20px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
}
.ao-flow dd {
    font-weight: 600;
    overflow: hidden;
    padding: 15px 15px 15px 20%;
}
.ao-flow dd h4 {
    color: #ff6000;
    font-size: 1.6rem;
    line-height: 1.4;
    margin-bottom: 5px;
}
.ao-flow dd a {
    background-color: #4c4d55;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    padding: 4px 1em;
    margin: 0 .5em 0 0;
}
.ao-flow:nth-of-type(7) {
    color: #FFF !important;
}
.ao-flow:nth-of-type(7)::before {
    display: none;
}
.ao-flow:nth-of-type(7) dt {
    color: #FFF;
}
.ao-flow:nth-of-type(7) dd h4 {
    color: #FFF;
}
.ao-flow.js_is-active {
    transform: translate3d(0, 0, 0);
    opacity: 1;
}
@media screen and (min-width: 1024px) {
    .ao-flow dt {
        width: 10%;
    }
    .ao-flow dd {
        font-size: 1.6rem;
        padding: 15px 15px 15px 10%;
    }
    .ao-flow dd h4 {
        font-size: 1.8rem;
    }
}
.fow-arrow {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 12px 0 12px;
    border-color: #ffb808 transparent transparent transparent;
    margin: 10px auto 10px;
    transform: translate3d(0, 40px, 0);
    opacity: 0;
    transition: opacity .4s, transform .4s;
    transition-delay: 0.1s;
}
.js_is-active + .fow-arrow {
    transform: translate3d(0, 0, 0);
    opacity: 1;
}
@media screen and (min-width: 768px) {
    .js_is-active {
        border-width: 24px 16px 0 16px;
    }
}
/* ================================
   #ページ：AO入試：テーブル
================================ */
.tabel-guideline {
    background-color: #FFF;
    border: #DDD solid 1px;
    border-radius: 8px;
    padding: 20px 2.5vw;
}
.tabel-guideline tr {
    background-image: url("../img/theme/line_table_dot.svg");
    background-size: auto 1px;
    background-position: left bottom;
    background-repeat: repeat-x;
}
.tabel-guideline tr:last-of-type {
    background-image: none;
}
.tabel-guideline th, .tabel-guideline td {
    padding: 1em;
    border: none;
}
.tabel-guideline th {
    background-color: transparent;
    text-align: left;
    vertical-align: top;
    width: 33.33337%;
    color: #9C60C4;
}
.tabel-guideline tr:nth-of-type(1) th, .tabel-guideline tr:nth-of-type(1) td {
    border-top: none;
}
.tabel-guideline strong {
    color: #ff6000;
}
.tabel-guideline ol {
    padding-left: 1.5em;
}
.tabel-guideline ol li + li {
    margin-top: .5em;
}
.tabel-guideline .ao-time {
    width: 5em;
}
@media screen and (min-width: 768px) {
    .tabel-guideline th {
        width: 20%;
    }
}
.txt-lage {
    background-color: #FFF;
    font-size: 1.4rem;
    line-height: 1.8;
    line-height: 1.8;
}
.txt-lage strong {
    font-size: 1.6rem;
    margin: auto;
    text-decoration: underline;
}
@media screen and (min-width: 768px) {
    .txt-lage {
        font-size: 1.6rem;
    }
    .txt-lage strong {
        font-size: 1.8rem;
        margin: auto;
        text-decoration: underline;
    }
}

@media screen and (max-width: 768px) {
.sp-table-block,
.sp-table-block thead,
.sp-table-block tbody,
.sp-table-block tr,
.sp-table-block th,
.sp-table-block td {
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100% !important;
    height: auto !important;
}
.tabel-guideline .sp-table-block th {
    padding-bottom: 0;
}

.ao-department-sp-heading {display: none !important;}
.ao-department-sp-table tr {
    margin-bottom: 20px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
}
.ao-department-sp-table tr.sp-bdr2 {
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom-style: dotted;
}
.ao-department-sp-table tr.pc-only {display: none !important;}
.ao-department-sp-table tr:after {
    display: block;
    content: "";
    clear: both;
}
.ao-department-sp-table th,
.ao-department-sp-table td {
    border: 0;
    padding: 0 !important;
    margin-bottom: 5px !important;
    text-align: left !important;
}
.ao-department-sp-table td.sp-two-column {
    float: left;
    width: auto !important;
    padding-top: 5px !important;
}
.ao-department-sp-table td.sp-two-column + td.sp-two-column {
    margin-left: 30px;
}
}

/* ================================================================
   #ページ：入試・学費
================================================================ */
.exam-aobtn {
    display: block;
    color: #fff !important;
    background: #ff6000;
    text-decoration: none;
    text-align: center;
    padding: 30px 15px;
    text-decoration: none !important;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    font-size: 2.4rem;
    font-weight: 600;
    border-radius: 8px;
}
.exam-aobtn:hover {background: #ff9f28;}
.exam-aobtn .btn-arrow-icon {
    background-image: url(../img/theme/icon_arrow.svg);
    background-size: auto 100%;
    background-position: center;
    height: 12px;
    width: 12px;
    margin: auto;
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 0;
    right: 20px;
}
.exam-aobtn {}

.exam-anchor {margin-bottom: 40px;}
.exam-anchor ul {
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin-left: 0 !important;
    margin-right: -10px;
    flex-wrap: wrap;
    position: relative;
}
.exam-anchor ul:before,
.exam-anchor ul:after {display: none;}
.exam-anchor li {
   flex-grow: 1;
   margin-right: 10px;
   width: 17%;
   margin-bottom: 10px;
}
.exam-anchor li:last {margin-right: 0;}
.exam-anchor li + li {margin-top: 0 !important;}
.exam-anchor a {
    text-decoration: none !important;
    color: #fff !important;
    display: block;
    text-align: center;
    background: #a0a0a0;
    padding: 10px;
    position: relative;
    font-size: 1.6rem;
    line-height: 160%;
    border-radius: 2px;
}
.exam-anchor a:before,
.exam-anchor a:after {
    display: block;
    content: "";
    position: absolute;
    width: 2px;
    height: 6px;
    background: #fff;
    top: 50%;
    margin-top: -3px;
}
.exam-anchor a:before {
    right: 9px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.exam-anchor a:after {
    right: 12px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.exam-anchor li.page a:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -1px;
}
.exam-anchor li.page a:after {
    right: 9px;
    margin-top: -4px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.exam-anchor a:hover {background: #ff6000;}
.exam-aomerit h2 {
    padding-left: 0 !important;
    padding-top: 0 !important;
    font-size: 2.4rem !important;
}
.exam-aomerit dd {margin-left: 10px;}
.exam-aomerit h3 {
    border-top: 0 !important;
    border-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
@media screen and (max-width: 768px) {
    .exam-aobtn {
        position: relative;
        margin-left: -5vw;
        margin-right: -5vw;
        font-size: 1.8rem;
        padding: 18px 10px;
        padding-left: 0;
    }
    .exam-anchor ul {margin-right: -5px;}
    .exam-anchor li {
        width: auto;
        margin-right: 5px;
        margin-bottom: 5px;
    }
    .exam-anchor a {font-size: 1.4rem;}
}

/* ================================================================
   #ページ：施設紹介
================================================================ */
.con-copy {
    font-size: 2.2rem;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1.6;
    margin-bottom: 30px;
}
@media screen and (min-width: 768px) {
    .con-copy {
        font-size: 3.6rem;
    }
}
.con-copy-middle {
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: .15em;
    line-height: 1.8;
    margin-top: 1em;
    margin-bottom: 1em;
}
@media screen and (min-width: 768px) {
    .con-copy-middle {
        margin-top: 0;
        font-size: 2.8rem;
    }
}
.con-copy-txt {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.8;
}
@media screen and (min-width: 768px) {
    .con-copy-txt {
        font-size: 1.6rem;
    }
}
@media screen and (min-width: 1366px) {
    .con-copy-txt {
        font-size: 1.8rem;
    }
}
.con-copy-txt-min {
    font-size: 1.4rem;
    line-height: 1.8;
}
@media screen and (min-width: 768px) {
    .con-copy-txt-min {
        font-size: 1.6rem;
    }
}
.con-txt-wrap {
    background-color: #FFF;
    padding: 0 0 5vw 5vw;
    z-index: 2;
}
.con-txt-wrap h4 {
    background-color: #FFF;
    display: inline-block;
    font-size: 1.6rem;
    /*padding: 1em 2em 0 5vw;*/
    padding: 0.6em 1.2em 0 20px;
    margin: 0;
    margin-left: -5vw;
    /*top: -2.3em;*/
    top: -1.9em;
}
.con-txt-wrap h4 small {
    display: block;
    font-weight: 400;
    font-size: 1rem;
}
.con-txt-wrap p {
    font-size: 1.4rem;
    margin-top: -1.6em;
}
@media screen and (min-width: 768px) {
    .con-txt-wrap {
        padding: 0 0 20px 20px;
    }
    .con-txt-wrap h4 {
        font-size: 1.6rem;
        /*padding: 1em 4em 0 20px;*/
        padding: 0.6em 1.2em 0 20px;
        margin-left: -20px;
    }
}
/* ================================================================
   #ページ：情報公開
================================================================ */
.mid-ttl {
    border-left: #231815 solid 4px;
    font-size: 1.8rem;
    line-height: 1.4;
    margin-bottom: 1em;
    padding-left: .5em;
}
@media screen and (min-width: 768px) {
    .mid-ttl {
        font-size: 2rem;
    }
}
.doc-btn-wrap {
    margin-top: -10px;
}
.doc-btn {
    display: flex;
    align-items: center;
    flex-grow: 1;
    min-height: 72px;
}
.doc-btn .btn-inner {
    width: 100%;
    padding: 0 calc(60px + 1em) 0 1.5em;
}
.doc-btn p {
    font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
    .doc-btn p {
        font-size: 1.6rem;
    }
}
.btn-pdf-icon {
    background-image: url("../img/theme/icon_pdf.svg"), url("../img/theme/line_dot_v.svg");
    background-size: auto 24px, auto 4px;
    background-position: right center, left top;
    background-repeat: no-repeat, repeat-y;
    height: 40px;
    width: 40px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
}
.pt-0 {
    padding-top: 0 !important;
}
.pb-0 {
    padding-bottom: 0 !important;
}
.facillity-photo-1 {
    margin-left: -5vw;
    margin-right: -5vw;
}
@media screen and (min-width: 768px) {
    .facillity-photo-1 {
        margin-left: auto;
        margin-right: -1.25vw;
        transform: translateY(-35%);
    }
}
.facillity-photo-4 {
    margin-left: -5vw;
    margin-right: -5vw;
}
@media screen and (min-width: 768px) {
    .facillity-photo-4 {
        margin-right: auto;
        margin-left: -1.25vw;
    }
}
@media screen and (min-width: 768px) {
    .equipment-item:nth-of-type(1), .equipment-item:nth-of-type(3), .equipment-item:nth-of-type(5), .equipment-item:nth-of-type(7), .equipment-item:nth-of-type(9), .equipment-item:nth-of-type(11) {
        transform: translateY(96px);
    }
}
.photo-item-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    margin: 0 -5vw;
}
.photo-item-box figure {
    flex-basis: 50%;
    max-width: 50%;
    padding: 0 5vw;
}
@media screen and (min-width: 768px) {
    .photo-item-box {
        margin: 0 -1.25vw;
    }
    .photo-item-box figure {
        flex-basis: 50%;
        max-width: 50%;
        padding: 0 1.25vw;
    }
}
#movie-section {
    padding-top: 0;
    padding-bottom: 0;
}
#movie-section-02 {
  padding-top: 0;
}
#movie-section .movie-ttl,
#movie-section-02 .movie-ttl {
    font-size: 1.4rem;
    text-align: center;
    font-weight: 600;
    display: block;
    margin-bottom: calc(1em + 10px);
}
#movie-section .movie-ttl span,
#movie-section-02 .movie-ttl span {
    background-color: #ff6000;
    border-radius: 3em;
    color: #FFF;
    display: inline-block;
    padding: .25em 1em;
}
#movie-section .movie-ttl span::before,
#movie-section-02 .movie-ttl span::before {
    content: "";
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: #ff6000 transparent transparent transparent;
    width: 0;
    height: 0;
    margin: auto;
    position: absolute;
    right: 0;
    bottom: -10px;
    left: 0;
}
@media screen and (min-width: 768px) {
    #movie-section .movie-ttl,
    #movie-section-02 .movie-ttl {
        font-size: 1.8rem;
    }
}
#map-section {
    padding-top: 0;
}
/* ================================================================
   #就職・資格
================================================================ */
.qua-faq i {
    background-color: #231815;
    border-radius: 100%;
    color: #FFF;
    display: inline-block;
    font-size: 120%;
    width: 1.6em;
    height: 1.6em;
    text-align: center;
    line-height: 1.6;
    margin-right: 10px;
}
.percentage {
    font-size: 36vw;
    font-weight: 400;
    line-height: .8;
    font-feature-settings: "palt";
    color: #00b5ed;
    text-align: center;
}
.percentage small {
    font-size: 80%;
}
@media screen and (min-width: 768px) {
    .percentage {
        font-size: 8vw;
    }
}
.national-qua h3 {
    background-color: #FFF;
    border: #00b5ed solid 3px;
    color: #00b5ed;
    font-size: 1.8rem;
    text-align: center;
    padding: 10px 0;
    margin: 0 0 1em;
}
.national-qua h4 {
    color: #00b5ed;
    font-size: 1.6em;
    text-align: center;
    margin-bottom: 0;
    margin-top: 20px;
}
.national-qua dl {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.national-qua dl dt {
    font-size: 1.6rem;
    font-weight: 600;
}
.national-qua dl dd {
    padding-left: 15px;
}
.national-qua dl dd .percentage {
    font-size: 24vw;
    text-align: right;
}
@media screen and (min-width: 768px) {
    .national-qua dl dd .percentage {
        font-size: 5vw;
    }
}
.national-qua-pop {
    text-align: center;
    margin-top: 20px;
}
.national-qua-pop span {
    background-color: #00b5ed;
    border-radius: 4em;
    color: #FFFF4D;
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    padding: 5px 2em;
}
.national-qua-pop span::before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 10px 8px;
    border-color: transparent transparent #00b5ed transparent;
    margin: auto;
    position: absolute;
    top: -10px;
    right: 0;
    left: 0;
}
.national-qua-pop strong {
    display: inline-block;
    font-size: 150%;
    padding-left: .5em;
}
.vendor-qua h3 {
    font-size: 1.8rem;
    text-align: center;
    margin: 15px 0;
}
.vendor-qua h4 {
    background-color: #FFF;
    font-size: 1.6rem;
    text-align: center;
    padding: 20px 0 10px;
    margin: 30px 0 0;
}
.vendor-qua h4 span {
    background-color: #231815;
    color: #FFF;
    display: inline-block;
    font-size: 1.4rem;
    padding: 4px 10px;
    margin: auto;
    position: absolute;
    top: -15px;
    right: 25%;
    left: 25%;
}
.credential-list {
    list-style: none;
}
.credential-list li {
    display: inline-block;
    font-size: 1.1rem;
    padding: 5px;
}
.credential-list .dep-icon {
    color: #ff6000;
    display: inline-block;
    padding-left: 1px;
}
@media screen and (min-width: 768px) {
    .credential-list li {
        font-size: 1.4rem;
    }
}
.dep_1 {
    color: #ff6000 !important;
}
.dep_2 {
    color: #c585ff !important;
}
.dep_3 {
    color: #00d3aa !important;
}
.dep_4 {
    color: #ee76ad !important;
}
.dep_5 {
    color: #ffb808 !important;
}
.dep_6 {
    color: #00b5ed !important;
}
/* ================================================================
   #就職サポート
================================================================ */
.employment-flow {
    max-width: 960px;
}
.employment-item h4 {
    font-size: 1.6rem;
    margin-top: 10px;
    margin-bottom: 0;
}
.employment-item h4 small {
    font-size: 1.2rem;
}
.interview-item {
    display: flex;
    flex-wrap: wrap;
}
.interview-item dt {
    flex-basis: 30%;
    max-width: 30%;
}
.interview-item dd {
    flex-basis: 70%;
    max-width: 70%;
    padding-left: 15px;
}
.interview-item i {
    background-color: #ffb808;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    font-weight: 600;
    padding: 4px 1em;
    margin-bottom: 10px;
}
.interview-item h3 {
    font-size: 1.6rem;
    margin-bottom: 1em;
}
.interview-item h3 small {
    display: block;
    font-size: 1.2rem;
}
.interview-item h4 {
    font-size: 1.2rem;
    line-height: 1.4;
}
.interview-item h4 span {
    display: block;
}
.collaboration-item h3 {
    border-bottom: #231815 solid 2px;
    padding-bottom: 10px;
    margin-bottom: 1em;
}
.collaboration-item h3 small {
    color: #ff6000;
    display: block;
    font-size: 1.4rem;
    margin-bottom: 10px;
}
.collaboration-item h3 small strong {
    font-size: 150%;
}
.collaboration-item p {
    margin: 0 0 1em;
}
.collaboration-item .outline {
    background-color: #231815;
    color: #FFF;
    display: inline-block;
    padding: 10px 15px;
    max-width: 80%;
    position: absolute;
    bottom: -2em;
    left: 0;
}
.collaboration-item .outline p {
    font-size: 1rem;
    margin: 0;
}
.collaboration-item .outline p strong {
    font-size: 1.4rem;
}
.collaboration-item figure {
    margin-left: -5vw;
    margin-right: -5vw;
    margin-bottom: 3em;
}
.collaboration-item .sub-img {
    margin: 0 -10px;
}
.collaboration-item .sub-img img {
    display: block;
    float: left;
    width: 50%;
    padding: 10px;
}
@media screen and (min-width: 768px) {
    .collaboration-item figure {
        margin-left: 0;
        margin-right: 0;
    }
    .collaboration-item .outline p {
        font-size: 1.2rem;
    }
    .collaboration-item .outline p strong {
        font-size: 1.6rem;
    }
}
.ncch-logo img {
    width: 50%;
    margin: auto;
}
.comptia {
    background-color: #e72410;
    color: #FFF;
    margin: 1em 0;
    padding: 15px;
}
.comptia h4 {
    font-size: 1.4rem;
    margin: 0;
}
.comptia p {
    font-size: 1.2rem;
    line-height: 1.6;
    margin: 0;
}
#gallery-wrap {
    height: 80vw;
}
@media screen and (min-width: 1024px) {
    #gallery-wrap {
        height: 28vw;
        margin-bottom: 60px;
    }
}
/* ================================================================
   #ページ：オープンキャンパス
================================================================ */
/* Scss Document */
#svg-animation {
    width: 100%;
    height: auto;
}
#svg-animation .st0 {
    fill: none;
    stroke: #000000;
    stroke-width: 10;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-miterlimit: 10;
    stroke-dasharray: 1500;
    /* この行を追加 */
    stroke-dashoffset: 1500;
    /* この行を追加 */
}
@media screen and (min-width: 768px) {
    #svg-animation {
        max-width: 80%;
        margin: auto;
    }
}
.oc-point-item h2 {
    line-height: 1.4;
    text-align: center;
}
.oc-point-item h2 .small {
    text-align: left;
}
.oc-point-item p {
    color: #ff6000;
    font-size: 2rem;
    font-weight: 600;
    text-decoration: underline;
    text-align: center;
}
.oc-point-item p .font-eng {
    font-size: 175%;
    display: inline-block;
    padding: 0 .2em;
}
@media screen and (min-width: 768px) {
    .oc-point-item h2 {
        font-size: 1.8rem;
    }
    .oc-point-item p {
        font-size: 1.6rem;
    }
}
@media screen and (min-width: 1024px) {
    .oc-point-item h2 {
        font-size: 2.4rem;
    }
    .oc-point-item p {
        font-size: 1.8rem;
    }
}
@media screen and (min-width: 1366px) {
    .oc-point-item h2 {
        font-size: 2.8rem;
    }
    .oc-point-item p {
        font-size: 2.4rem;
    }
    .oc-point-item.ao-point-item h2 {
        font-size: 2rem;
        text-align: left;
    }
}
.oc-point-item-header {
    margin-bottom: 10px;
}
.oc-point-item-inner dl {
    display: flex;
}
.oc-point-item-inner dl dt {
    flex-basis: 20%;
    max-width: 20%;
}
.oc-point-item-inner dl dt i {
    background-color: #ff6000;
    border-radius: 2px;
    color: #FFF;
    display: block;
    font-weight: 600;
    text-align: center;
    height: 44px;
    width: 44px;
    line-height: 44px;
    font-size: 1.8rem;
}
.oc-point-item-inner dl dd {
    flex-basis: 80%;
    max-width: 80%;
}
.oc-point-item-inner dl dd h3 {
    font-size: 2rem;
    line-height: 1.4;
}
.oc-point-item-inner dl dd p {
    color: #231815;
    text-decoration: none;
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.8;
    text-align: left;
    margin-top: .5em;
}
@media screen and (min-width: 1024px) {
    .oc-point-item-inner dl dt i {
        font-size: 2.4rem;
        height: 56px;
        width: 56px;
        line-height: 56px;
    }
    .oc-point-item-inner dl dd p {
        font-size: 1.6rem;
    }
}
.oc-program-bnr {
    max-width: 960px;
    margin: 60px auto 80px;
}
.oc-program-bnr ul {
    list-style: none;
    display: flex;
    justify-content: space-between;
}
.oc-program-bnr li {
    width: 49%;
    text-align: center;
}
@media screen and (max-width: 768px) {
    .oc-program-bnr {
        margin-top: 30px;
        margin-bottom: 40px;
    }
    .oc-program-bnr ul {
        flex-direction: column;
        margin-left: 10px;
        margin-right: 10px;
    }
    .oc-program-bnr li {
        width: auto;
    }
    .oc-program-bnr li + li {
        margin-top: 15px;
    }
}

.oc-bus-usage {
    max-width: 530px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
    border-radius: 12px;
    background: #fae7a2;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px;
}
.oc-bus-usage p {
    margin-bottom: 4px;
}
.oc-bus-usage ul {
    list-style: none;
}
.oc-bus-usage li {
    margin-bottom: 4px;
}
.oc-bus-usage li.indent {
    text-indent: -3.6em;
    padding-left: 3.6em;
}
.oc-bus-usage li:last-child {
    margin-bottom: 0;
}
/* ================================================================
   #オープンキャンパス：日程
================================================================ */
.oc-item {
    background-color: #ffd44d;
    border-radius: 4px;
    display: block;
    /*padding: 1em 4em 1em 2em;*/
    padding: 0.8em 1.4em 0.8em 1.0em;
}
.oc-item:hover {
    background-color: #ffb808;
    color: #FFF;
}
.oc-item dl {
    display: flex;
    align-items: center;
}
.oc-item dl dt {
    border-right: #FFF solid 1px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex-basis: 4em;
    max-width: 4em;
    font-size: 2rem;
    font-weight: 600;
}
.oc-item dl dt .oc-yy {
    font-size: 1rem;
    font-weight: normal;
    display: block;
    padding-right: 1em;
    width: 100%;
}
.oc-item dl dd {
    /*flex-basis: calc(100% - 7em);*/
    flex-basis: calc(100% - 3em);
    /*max-width: calc(100% - 7em);*/
    max-width: calc(100% - 6em);
    /*padding-left: 2em;*/
    padding-left: 0.6em;
}
.oc-item dl dd h4 {
    font-size: 1rem;
    line-height: 1.4;
    margin: 0;
}
.oc-item dl dd h4.oc-bus-day {
    font-size: 1.4rem;
}
.oc-item dl dd h4.oc-bus-day span {
    display: inline-block;
    background: url(../img/opencampus/icon_bus.svg) no-repeat left center;
    background-size: 2.8rem 1.6rem;
    padding-left: 2.6rem;
}
.oc-item + .oc-item {
    margin-top: 5px;
}
.oc-item .arrow-link {
    background-image: url(../img/theme/icon_arrow.svg);
    background-size: 8px auto;
    background-position: center;
    height: 32px;
    width: 32px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    /*right: -3em;*/
    right: -2em;
}
@media screen and (min-width: 768px) {
    .oc-item {
        padding: 1em 2em 1em 1.5em;
    }
    .oc-item dl {
        display: flex;
        align-items: center;
    }
    .oc-item dl dt {
        font-size: 3.6rem;
    }
    .oc-item dl dd {
        flex-basis: calc(100% - 5em);
        max-width: calc(100% - 5em);
        font-size: 1.6rem;
        padding-left: 1.2rem;
    }
    .oc-item dl dd h4 {
        font-size: 1.6rem;
    }
    .oc-item dl dd h4.oc-bus-day {
        font-size: 2.4rem;
    }
    .oc-item dl dd h4.oc-bus-day span {
        background-size: 5rem 3rem;
        padding-left: 5rem;
    }
    .oc-item .arrow-link {
        background-size: 12px auto;
        right: -1.5em;
    }
}
.week {
    background-color: royalblue;
    border-radius: 12px;
    color: #FFF;
    display: block;
    font-size: 1rem;
    line-height: 16px;
    text-align: center;
    height: 24px;
    min-width: 24px;
    padding: 4px;
    margin-left: .5em;
}
.bus-stop-info {
    font-size: 1rem;
    line-height: 1.4;
    display: block;
    margin-top: .5em;
    opacity: 0.6;
}
@media screen and (min-width: 768px) {
    .bus-stop-info {
        font-size: 1.2rem;
    }
}

.oc-schedule-wrap {
    display: flex;
    flex-wrap: wrap;
}
.oc-schedule-wrap > a {
    width: calc(50% - 5px);
    margin-left: 5px;
    margin-bottom: 5px;
}
.oc-schedule-wrap > a:nth-child(2n+1) {
    margin-left: 0;
}
.oc-schedule-wrap .oc-item + .oc-item {
    margin-top: 0;
}
@media screen and (min-width: 768px) {
    .oc-schedule-wrap > a {
        width: calc(25% - 5px);
    }
    .oc-schedule-wrap > a:nth-child(2n+1) {
        margin-left: 5px;
    }
    .oc-schedule-wrap > a:nth-child(4n+1) {
        margin-left: 0;
    }
}

/* ================================================================
   #ページ：オープンキャンパス
================================================================ */
#opencampus #top-event-section {
    background-color: #F7F7F7;
    padding-top: 96px;
}
#opencampus #top-event-section::before {
    display: none;
}
#loop-box {
    background-image: url("../img/opencampus/bg_loop.jpg");
    background-size: auto 100%;
    background-position: center;
    background-repeat: repeat-x;
    height: 320px;
    animation: bgiLoop 96s linear infinite;
}
@media screen and (min-width: 768px) {
    #loop-box {
        height: 480px;
    }
}
@keyframes bgiLoop {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: -2560px 0;
    }
}
#oc-schedule-section {
    padding-top: 0;
}
.oc-schedule-inner {
    background-color: #FFF;
    border-radius: 16px;
    margin-top: -64px;
    padding-top: 32px;
}
#notice-box {
    background-color: #FFE9ED;
    border: #ff0033 solid 3px;
    border-radius: 6px;
    display: flex;
    flex-wrap: wrap;
}
#notice-box dt {
    background-color: #ff0033;
    color: #FFF;
    font-size: 1.6rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-basis: 100%;
    width: 100%;
    padding: 1em;
}
#notice-box dd {
    flex-basis: 100%;
    width: 100%;
    padding: 20px;
}
#notice-box h3 {
    font-size: 1.6rem;
}
#notice-box p {
    font-weight: 600;
    margin-top: 1em;
}
#notice-box strong {
    color: #ff0033;
}
@media screen and (min-width: 768px) {
    #notice-box dt {
        flex-basis: 20%;
        width: 20%;
    }
    #notice-box dd {
        flex-basis: 80%;
        width: 80%;
    }
    #notice-box h3 {
        font-size: 1.8rem;
    }
}
.support-item {
    background-color: #FFF;
}
.support-item h2 {
    font-size: 1.8rem;
    margin-bottom: 1em;
    background: -webkit-linear-gradient(-180deg, #f7b42c, #ff6000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.support-item h3 {
    font-size: 1.6rem;
    background-color: #ffb808;
    background-image: linear-gradient(315deg, #f7b42c 0%, #fc575e 74%);
    border-radius: 2px;
    display: inline-block;
    color: #FFF;
    font-size: 1.4rem;
    margin-bottom: 1em;
    padding: .5em 1em;
}
.support-item h3 span {
    display: inline-block;
    background-color: #FFF;
    border-radius: 2px;
    padding: 2px 10px;
    color: #ff6000;
    margin-left: 10px;
}
.support-item p {
    line-height: 1.8;
}
.support-item p strong {
    font-size: 1.6rem;
    margin: auto;
    text-decoration: underline;
}
@media screen and (min-width: 768px) {
    .support-item h2 {
        font-size: 2.4rem;
    }
    .support-item h3 {
        font-size: 1.6rem;
    }
}
hr {
    background-image: url(../img/theme/line_table_dot.svg);
    background-size: auto 1px;
    background-position: left bottom;
    background-repeat: repeat-x;
    border: none;
    height: 1px;
    display: block;
    width: 100%;
}
#hogosya-seminar table {
    background-color: #FFF;
    text-align: left;
}
.line-box {
    background-color: #75DD3C;
    border-radius: 8px;
    display: flex;
    align-items: center;
    padding: 20px;
}
.line-box svg {
    fill: #FFF;
    width: 48px;
    height: 48px;
}
/* ================================================================
   #オープンキャンパス：ポイント
================================================================ */
#oc_point{
  margin: 100px 0;
}
.oc_point_inner{
  border: 4px solid #ff6000;
  padding: 55px 25px;
  border-radius: 10px;
}
.oc_point_day{
  text-align: center;
}
.oc_point_day h3{
  position: relative;
  padding: 0.8rem 5rem;
  color: #fff;
  border-radius: 50vh;
  background: #ff6000;
  text-align: center;
  display: inline-block;
}
.oc_point_day h3:after {
  position: absolute;
  bottom: -9px;
  left: 50%;
  width: 0;
  height: 0;
  content: '';
  border-width: 10px 10px 0 10px;
  border-style: solid;
  border-color: #ff6000 transparent transparent transparent;
}
.oc_point_day p{
  font-size: 2.8rem;
  font-weight: 900;
  margin-top: -20px;
}
.oc_point_day p span{
  font-size: 12rem;
  margin-right: 5px;
}
.oc_point_detail{
  text-align: center;
  margin-top: -15px;
}
.oc_point_detail img{
  margin: 0 auto;
}
.oc_point_detail h4{
  font-size: 2.6rem;
  color: #ff6000;
  margin: 20px 0;
}
.oc_point_detail p{
  font-size: 1.6rem;
}
/*btn*/
.point-btn {
  margin: 25px 0 40px 0;
  text-align: center;
}
.point-btn a {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1.5rem 5rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  letter-spacing: 0.1em;
  color: #231815;
  border: 2px solid #000;
  -webkit-box-shadow: 4px 4px 0 #231815;
  box-shadow: 4px 4px 0 #231815;
  background: #fff;
}
.point-btn a:hover {
  -webkit-box-shadow: -4px -4px 0 #231815;
  box-shadow: -4px -4px 0 #231815;
  background: linear-gradient(-45deg, #c585ff 20%, #ffb808, #c585ff 80%);
  background-size: 500% 500%;
  animation: AnimationName .8s ease 1 forwards;
  color: #fff;
}
.reflection{
display:inline-block;
position:relative;
overflow:hidden;
}
.reflection:after {
content:"";
height:100%;
width:30px;
position:absolute;
top:-180px;
left:0;
background: linear-gradient(45deg, #c585ff 20%, #ffb808, #c585ff 80%);
opacity:0;
-webkit-transform: rotate(45deg);
-webkit-animation: reflection 2s ease-in-out infinite;
}
@keyframes reflection {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@media screen and (min-width: 768px) {
.oc_point_detail {
  max-width: calc(751px + 1.875vw * 2);
  margin-left: auto;
  margin-right: auto;
}
/*btn*/
.point-btn a {
  font-size: 1.5rem;
  padding: 2rem 9rem;
}
}
@media screen and (max-width: 767px) {
#oc_point{
  margin: 50px 0;
}
.oc_point_inner{
  padding: 35px 25px;
}
.oc_point_day h3 {
  padding: 0.6rem 3rem;
  font-size: 1.6rem;
}
.oc_point_day p{
  font-size: 2.2rem;
  margin-top: -5px;
}
p.oc_center {
	text-align:center !Important;
}
.oc_point_day p span{
  font-size: 20vw;
}
.oc_point_detail{
  text-align: left;
}
.oc_point_detail h4 {
  font-size: 1.8rem;
  margin: 10px 0;
}
.oc_point_detail p{
  font-size: 1.4rem;
}
/*btn*/
.point-btn {
  margin: 15px 0 30px 0;
}
}

/* ================================================================
   #ページ：在校生の声
================================================================ */
.page_link {
	display: block;
	margin-top:-80px;
  padding-top:80px;
	z-index: -100;
}

@media screen and (min-width: 768px) {
	.page_link {
	display: block;
	margin-top:-100px;
  padding-top:100px;
	z-index: -100;
}
}

.page-jump-list {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: -2px -2px 27px;
	z-index: 2;
}
.page-jump-list li {
	flex-basis: 50%;
	max-width: 50%;
	padding: 2px;
}
.page-jump-list li a {
	background-color: #FFF;
		border: #DDD solid 2px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 64px;
font-weight: bold;
	padding: 1em;
}
.page-jump-list li a span{
    display: inline-block;
	font-size: 1.1rem;
    padding-right: 1em;
    line-height: 1.4;
}
.page-jump-list li a span::before {
content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 4px 0 4px;
    border-color: #000 transparent transparent transparent;
    margin: auto;
    position: absolute;
    top: 2px;
    bottom: 0;
    right: 0;
}
.page-jump-list li a:hover {
	background-color: #F4F4F4;
	border: #F4F4F4 solid 1px;
}
.page-jump-list li a:hover span::before {
	border-color: #ff6000 transparent transparent transparent;
}

@media screen and (min-width: 768px) {
	.page-jump-list {
		margin: -5px -5px 27px;
	}
	.page-jump-list li {
	flex-basis: 33.33337%;
	max-width: 33.33337%;
	padding: 5px;
}
	#faq .page-jump-list li {
		flex-basis: 25%;
	max-width: 25%;
	}
	.page-jump-list li a span {
		font-size: 1.4rem;
	}
}

.voice-ttl {
	    background-color: #ee76ad;
	border-radius: 2px;
    font-size: 1.8rem;
    margin-bottom: 1em;
    padding: 1em 20px;
    color: #FFF;

}
@media screen and (min-width: 768px) {
	.voice-ttl {
		font-size: 2.2rem;
	}
}


.voice-lead-ttl {
	text-align: center;
	margin-bottom: 32px;
}

.voice-item {
	margin-bottom: 48px;
}

@media screen and (max-width: 768px) {
  .works_last {
    margin-bottom: 24px !important;
  }
  .photo-box {
    margin: 0 !important;
  }
}

.voice-area {
	    background-color: #FFFF47;
    border-radius: 0 0 8px 0;
    padding: .75em 20px;
    font-size: 1.6rem;
    letter-spacing: .1em;
    font-weight: 600;
    position: absolute;
    top: 0;
    z-index: 2;
}

.voice-item .con-txt-wrap {
	padding: 0;
}

.voice-item h4 {
	background-color: #000;
	font-size: 1.4rem;
	color: #FFF;
	top: 0;
	transform: translateY(-100%);
	    margin: 0;
	padding: .5em 20px;
}
.voice-ai .voice-ttl,
.voice-ai h4,
.voice-ai .photo-anime .photo-anime-layer {
	background-color: #c585ff;
}
.voice-ai .voice-ttl,
.voice-ai h4,
.voice-ai .photo-anime .photo-anime-layer {
	background-color: #c585ff;
}
.voice-sys .voice-ttl,
.voice-sys h4,
.voice-sys .photo-anime .photo-anime-layer {
	background-color: #00d3aa;
}
.voice-chara .voice-ttl,
.voice-chara h4,
.voice-chara .photo-anime .photo-anime-layer {
	background-color: #00a040;
}
.voice-game .voice-ttl,
.voice-game h4,
.voice-game .photo-anime .photo-anime-layer {
	background-color: #ee76ad;
}
.voice-esports .voice-ttl,
.voice-esports h4,
.voice-esports .photo-anime .photo-anime-layer {
	background-color: #ff6000;
}

.voice-cg_web .voice-ttl,
.voice-cg_web h4,
.voice-cg_web .photo-anime .photo-anime-layer {
	background-color: #ffb808;
}
.voice-it .voice-ttl,
.voice-it h4,
.voice-it .photo-anime .photo-anime-layer {
	background-color: #00b5ed;
}
.voice-expert .voice-ttl,
.voice-expert h4,
.voice-expert .photo-anime .photo-anime-layer {
	/*background: linear-gradient(90deg, #006FBC, #D65F26);*/
	background: #D65F26;
}

.voice-item .con-txt-wrap .wf_btn-wrap {
	margin-top: 24px;
}


.voice-item .con-txt-wrap p {
	margin-top: 0;
}

.voice-item .con-txt-wrap .voice-profile {
	border-bottom: #DDD solid 1px;
	font-size: 1.6rem;
		font-weight: bold;
	margin-top: -1.4em;
	margin-bottom: 1em;
			padding-bottom: .5em;
}
.voice-item .con-txt-wrap .voice-profile small {
	font-size: 1.4rem;
}

/* ================================================================
   #Q&A
================================================================ */
.js_acc_switch {
  cursor: pointer; }

.js_acc_item {
  display: none; }

.__js_is_open + .js_acc_item {
  display: block;
  margin: 16px 0 48px; }


.faq_wrap {
	counter-reset: number 0;
	margin-top: 48px;
}
.color_ttl {
	background-color: #ff6000;
    border-radius: 2px;
    font-size: 1.8rem;
    margin-bottom: 1em;
    padding: 1em 20px;
    color: #FFF;
}

.faq_ttl {
	background-color: #FFF;
  border: #E4E4E4 solid 1px;
  border-radius: 4px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 1.6rem;
	    padding: 1em 48px 1em .5em;
  margin: 16px 0;
z-index: 2;}
  .faq_ttl:hover {
    background-color: #F4F4F4;
    border-color: #F4F4F4;
	  color: #ff6000;
}
  .faq_ttl > span {
    display: block;
    flex-basis: calc(100% - 40px);
    max-width: calc(100% - 40px); }
  .faq_ttl::before, .faq_ttl::after {
    content: "";
    background-color: #222222;
    height: 2px;
    width: 12px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 24px;
    bottom: 0; }
  .faq_ttl::after {
    transform: rotate(90deg); }
  .faq_ttl .faq_f {
    font-size: 1.4rem;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px; }
  .faq_ttl.__js_is_open {
	  background-color: #F4F4F4;
	  border-color: #F4F4F4;
    color: #ff6000; }
 .faq_ttl.__js_is_open::after {
	 display: none;
}

.faq_wrap .faq_ttl .faq_f::before {
  counter-increment: number 1;
  content: "Q." counter(number); }

.faq_content {
	z-index: 2;
}
  .faq_content p {
	  background-color: #FFF;
    font-size: 1.4rem;
line-height: 1.8;
}

  .faq_content .wf_btn-wrap {
	      text-align: left;
	margin-top: 24px;
}
.faq_content .wf_btn-wrap + .wf_btn-wrap {
	margin-top: 12px;
}

.__js_is_open + .js_acc_item .faq_content {
  animation-name: acc_anime;
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  animation-fill-mode: both; }


@media screen and (min-width: 768px) {
	.faq_ttl {
		font-size: 1.8rem;
		  padding: 1em 64px 1em 1.25em;
	}
	.faq_content {
  padding-left: 64px; }
}

@keyframes acc_anime {
  0% {
    opacity: 0;
    transform: translate3d(0, 24px, 0); }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0); } }

/* ================================================================
   #コンポーネント：タブ
================================================================ */
/* Scss Document */
.anime-item {
    opacity: 0;
    transform: translate3d(0, 50px, 0);
    transition: opacity ease-out .6s, transform ease-out .6s;
}
.anime-item.anime_is-active {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}
/* ==============================================================
   #見出しアニメ
   ============================================================== */
.ttl-anime {
    display: inline-block;
    overflow: hidden;
}
.ttl-anime::before {
    content: "";
    background-color: #262422;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -ms-transform: translate3d(100%, 0, 0);
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    z-index: 2;
}
/*IE11対応*/
_:-ms-lang(x)::-ms-backdrop, .ttl-anime::before {
    background-color: transparent;
}
.sec-ttl[data-emergence=visible] .ttl-anime::before {
    -webkit-animation: photoSlide 1.4s cubic-bezier(0.075, 0.82, 0.165, 1) 0s 1 forwards;
    animation: photoSlide 1.4s cubic-bezier(0.075, 0.82, 0.165, 1) 0s 1 forwards;
}
.sec-ttl span, .sec-ttl small {
    opacity: 0;
    transform: translate3d(-30px, 0, 0);
}
.sec-ttl[data-emergence=visible] span, .sec-ttl[data-emergence=visible] small {
    opacity: 1;
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s;
}
/* ==============================================================
   #画像アニメ
   ============================================================== */
.photo-box {
    background-color: #DDD;
}
.photo-anime figure {
    -webkit-backface-visibility: hidden;
    overflow: hidden;
}
.photo-anime .photo-anime-layer {
    background-color: #ff6000;
    margin: auto;
    position: absolute;
    top: -10px;
    right: 0;
    bottom: -10px;
    left: 0;
    transform: translate3d(102%, 0, 0);
    -webkit-backface-visibility: hidden;
    overflow: hidden;
    will-change: transform;
}
/*IE11対応*/
_:-ms-lang(x)::-ms-backdrop, .photo-anime .photo-anime-layer {
    background-color: transparent;
}
.anime_is-active .photo-anime .photo-anime-layer {
    -webkit-animation: photoSlide 2s cubic-bezier(0.075, 0.82, 0.165, 1) 0s 1 forwards;
    animation: photoSlide 2s cubic-bezier(0.075, 0.82, 0.165, 1) 0s 1 forwards;
}
@keyframes photoSlide {
    0% {
        -webkit-transform: translate3d(-102%, 0, 0);
        transform: translate3d(-102%, 0, 0);
    }
    25% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(102%, 0, 0);
        transform: translate3d(102%, 0, 0);
    }
    100% {
        visibility: hidden;
        display: none;
    }
}
.photo-anime figure {
    opacity: 0;
    transform: translate3d(-30%, 0, 0);
    transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s;
}
.anime_is-active .photo-anime figure {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s, transform 1s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s;
}
/* ================================================================
   #メイン
================================================================ */
.wf_section {
    padding-top: 40px;
    padding-bottom: 40px;
    z-index: 10;
}
@media screen and (min-width: 1366px) {
    .wf_section {
        padding-top: 64px;
        padding-bottom: 64px;
    }
}
.pd-top-0 {
    padding-top: 0;
}
#bnr-section {
    background-color: #F7F7F7;
    padding-top: 64px;
    padding-bottom: 48px;
    overflow: hidden;
}
#bnr-section .news-item + .news-item .news-item-inner {
    border-top: none;
    padding-top: 0;
}
.lage-ttl {
    font-size: 2.4rem;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 1em;
}
.lage-ttl span {
    display: inline-block;
    font-weight: 800;
    letter-spacing: .15em;
    padding-left: .15em;
}
.lage-ttl span::before, .lage-ttl span::after {
    content: "";
    border-top: #231815 solid 1px;
    height: 0;
    width: 1.5em;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
}
.lage-ttl span::before {
    left: -2em;
}
.lage-ttl span::after {
    right: -2em;
}
.lage-ttl .font-jp {
    display: block;
    font-size: 1.4rem;
    margin-top: .5em;
}
@media screen and (min-width: 768px) {
    .lage-ttl {
        font-size: 4rem;
    }
    .lage-ttl span {
        display: inline-block;
    }
    .lage-ttl span::before, .lage-ttl span::after {
        width: 2em;
    }
    .lage-ttl span::before {
        left: -2.5em;
    }
    .lage-ttl span::after {
        right: -2.5em;
    }
    .lage-ttl .font-jp {
        font-size: 1.8rem;
    }
}
@media screen and (min-width: 1024px) {
    #course-curricurum .lage-ttl {
        margin-bottom: calc(64px + 1em);
    }
}
@media screen and (max-width: 768px) {
    .lage-ttl span.sp-nobdr::before,
    .lage-ttl span.sp-nobdr::after {
        display: none;
    }
}
/* ================================================================
   #フッター：コピーライト
================================================================ */
#copyright {
    text-align: center;
    font-size: 1.2rem;
    margin: auto;
}
/* ================================================================
   #フッター：スティッキーナビ
================================================================ */
#footer-sticky-nav {
    margin: auto;
    padding-left: 10px;
    padding-right: 10px;
    position: fixed;
    right: 0;
    bottom: 10px;
    left: 0;
    transform: translate3d(0, 0, 0);
    z-index: 1300;
}
#footer-sticky-nav .sticky-nav-heishu {
    display: flex;
    background-color: #FFF;
    color: black;
    font-weight: bold;
    text-align: left;
    box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 2px 0px, rgba(0, 0, 0, 0.05) 0px 2px 4px 0px;
    transform: translate3d(0, 160px, 0);
    height: 56px;
    line-height: 56px;
    max-width: 100%;
    margin-bottom: 0;
    transition: transform .2s;
    transition-timing-function: ease-out;
    z-index: 2;
    border-radius: 5px;
}
#footer-sticky-nav .sticky-nav-heishu p.heishu_text {
    font-size: 14px;
    line-height: 160%;
    margin-left: 0;
    width: 50%;
    border-radius: 10px;
}
#footer-sticky-nav .sticky-nav-heishu div.heishu_text {
    width: 50%;
    border-radius: 5px;
    border: 3px solid #1964C8;
    background-size: contain;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    justify-content: center;
}
#footer-sticky-nav .sticky-nav-heishu div.heishu_text img {
  object-fit: contain;
}
#footer-sticky-nav .sticky-nav-heishu p.heishu_text2 {
    /* font-size: 24px; */
    /* font-size: 20px; */
    /* line-height: 160%; */
    /* margin-top: 7px; */
    /* margin-left: 20px; */
    width: 50%;
    /* white-space: nowrap; */
    background-color: #1964C8;
    border-radius: 5px;
}
#footer-sticky-nav .sticky-nav-heishu div.heishu_text2 {
    width: 50%;
    /* background-color: #1964C8; */
    border-radius: 5px;
    display: flex;
}
#footer-sticky-nav .sticky-nav-heishu div.heishu_text2_right {
    margin: auto;
    width: 100%;
    display: flex;
    justify-content: center;
}
#footer-sticky-nav .sticky-nav-heishu div.heishu_text2_right img {
    height: auto;
    max-height: 56px;
}
#footer-sticky-nav .sticky-nav-heishu div.heishu_text2_left {
    margin-right: auto;
    /* display: contents; */
    overflow: hidden;
}
#footer-sticky-nav .sticky-nav-heishu span {
    color: #ff6000;
}
#footer-sticky-nav .sticky-nav-heishu span.bg_red {
    color: #FFF;
    background-color: #FC4429;
    padding: 1px 10px;
    font-size: 12px;
}
#footer-sticky-nav .sticky-nav-heishu span.bg_blue {
    display: inline-block;
    color: #000;
    background-color: #fff;
    padding: 7px 0;
    font-size: 12px;
    height: 56px;
    line-height: 1.2;
    text-align: center;
    border-top-left-radius: 5px;
    letter-spacing: -1px;
    /* min-width: 120px; */
    width: 100%;
    border-radius: 5px;
    border: 3px solid #007AF4;
}
#footer-sticky-nav .sticky-nav-heishu span.bg_blue span.w_school {
    font-size: 24px;
    color: #000;
}
#footer-sticky-nav .sticky-nav-heishu span.bg_blue span.de {
    font-size: 8px;
    color: #000;
    margin-left: -3px;
}
#footer-sticky-nav .sticky-nav-heishu span.big_text {
    display: inline-block;
    color: #000;
    /*font-size: 30px;*/
    font-size: 25px;
    margin-left: 0;
    margin-right: -13px;
    letter-spacing: -1px;
}
#footer-sticky-nav .sticky-nav-heishu:hover {
    background-color: #c585ff !important;
}
#footer-sticky-nav ul {
    box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 2px 0px, rgba(0, 0, 0, 0.05) 0px 2px 4px 0px;
    border-radius: 4px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    list-style: none;
    height: 56px;
    transform: translate3d(0, 160px, 0);
    transition: transform .2s;
    transition-timing-function: ease-out;
}
#footer-sticky-nav ul li {
    background-color: rgba(0, 0, 0, 0.6);
    display: block;
    flex-basis: 50%;
    max-width: 50%;
    height: 100%;
}
#footer-sticky-nav ul li.sticky-nav-item-1 {
    background-color: #ff6000;
    border-radius: 4px 0 0 4px;
    z-index: 3;
}
#footer-sticky-nav ul li.sticky-nav-item-2 {
    background-color: #ffb808;
    border-radius: 0 4px 4px 0;
    z-index: 2;
}
#footer-sticky-nav ul li:hover {
    background-color: #c585ff !important;
}
#footer-sticky-nav ul li a {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    height: 100%;
    padding: 0 5vw;
}
#footer-sticky-nav ul li p {
    color: #FFF;
    font-size: 1.2rem;
    font-weight: 600;
    text-align: center;
    margin: auto auto auto 0;
    overflow: hidden;
}
#footer-sticky-nav ul li p .narrow-text {
    display: block;
    width: 200%;
    text-align: left;
    transform: scaleX(0.9);
    transform-origin: left center;
}
#footer-sticky-nav.js_is-active ul, #footer-sticky-nav.js_is-active .sticky-nav-heishu {
    transform: translate3d(0, 0, 0);
}
#footer-sticky-nav .sticky-nav-heishu {
    display: flex;
    background-color: #1964C8;
}
#footer-sticky-nav .sticky-nav-image-0 {
    position: absolute;
    left: 0;
    bottom: 0;
}
#footer-sticky-nav .sticky-nav-image-0 img {
    height: 56px;
    width: auto;
    max-width: inherit;
}
#footer-sticky-nav .sticky-nav-image-1 {
    position: absolute;
    right: -8px;
    bottom: 0;
}
#footer-sticky-nav .sticky-nav-image-1 img {
    height: 70px;
    width: auto;
    max-width: inherit;
}
#footer-sticky-nav .sticky-nav-image-2 {
    position: absolute;
    right: 8px;
    bottom: 0;
}
#footer-sticky-nav .sticky-nav-image-2 img {
    height: 50px;
    width: auto;
    max-width: inherit;
}
#footer-sticky-nav .sticky-nav-arrow {
    background-color: #FFF;
    border-radius: 100%;
    height: 20px;
    width: 20px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 5vw;
    bottom: 0;
}
@media screen and (min-width: 768px) {
    #footer-sticky-nav .sticky-nav-heishu {
        max-width: 80%;
        margin: 0 auto;
    }
    #footer-sticky-nav ul {
        max-width: 80%;
        margin: auto;
    }
    #footer-sticky-nav ul li p {
        font-size: 1.4rem;
        margin: auto;
    }
    #footer-sticky-nav ul li p .narrow-text {
        width: auto;
        text-align: left;
        transform: none;
    }
    #footer-sticky-nav .sticky-nav-image-0 {
        left: 0;
    }
    #footer-sticky-nav .sticky-nav-image-0 img {
        height: 56px;
    }
    #footer-sticky-nav .sticky-nav-image-1 {
        right: -10px;
    }
    #footer-sticky-nav .sticky-nav-image-1 img {
        height: 55px;
    }
    #footer-sticky-nav .sticky-nav-image-2 {
        right: 8px;
    }
    #footer-sticky-nav .sticky-nav-image-2 img {
        height: 55px;
    }
}
@media screen and (min-width: 1024px) {
    #footer-sticky-nav {
        display: none;
        flex-direction: column;
        justify-content: center;
        width: 56px;
        padding-left: 0;
        padding-right: 0;
        top: 0;
        right: 0;
        bottom: 0;
        left: auto;
        z-index: 800;
    }
    #footer-sticky-nav ul {
        box-shadow: none;
        border-radius: 0;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: center;
        height: 520px;
        width: 100%;
        max-width: inherit;
        transform: translate3d(64px, 0, 0);
    }
    #footer-sticky-nav ul li {
        background-color: rgba(0, 0, 0, 0.6);
        display: block;
        flex-basis: calc(50% - 32px);
        max-width: 64px;
        height: calc(50% - 32px);
    }
    #footer-sticky-nav ul li.sticky-nav-item-1 {
        border-radius: 8px 0 0 0;
    }
    #footer-sticky-nav ul li.sticky-nav-item-2 {
        border-radius: 0 0 0 8px;
    }
    #footer-sticky-nav ul li a {
        padding: 0;
    }
    #footer-sticky-nav ul li p {
        writing-mode: vertical-rl;
        padding-bottom: 2em;
    }
    #footer-sticky-nav .sticky-nav-image-1 {
        right: -8px;
    }
    #footer-sticky-nav .sticky-nav-image-1 img {
        height: 48px;
    }
    #footer-sticky-nav .sticky-nav-image-2 {
        right: -8px;
    }
    #footer-sticky-nav .sticky-nav-image-2 img {
        height: 48px;
    }
}
.js_is-fix #footer-sticky-nav ul {
    transform: translate3d(0, 80px, 0) !important;
}
.sticky-nav-oc-days-txt {
    display: none;
}
.sticky-nav-oc-days-txt:nth-of-type(1) {
    display: block;
}
.sticky-nav-oc-days-txt:nth-of-type(1) strong {
    font-size: 120%;
}
/* ================================================================
   #マージン
================================================================ */
.mb-0 {
    margin-bottom: 0;
}
.mb-1em {
    margin-bottom: 1em;
}
.mb-10px {
    margin-bottom: 10px;
}
.mb-20px {
    margin-bottom: 20px;
}
.mb-30px {
    margin-bottom: 30px;
}
.mt-0 {
    margin-bottom: 0;
}
.mt-1em {
    margin-top: 1em;
}
.mt-10px {
    margin-top: 10px;
}
.mt-20px {
    margin-top: 20px;
}
.mt-30px {
    margin-top: 30px;
}
/* ================================================================
   #下層：パンくずリスト
================================================================ */
#tact-breadcrumbs {
    display: flex;
    align-items: center;
    padding-top: 2em;
    padding-bottom: 2em;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}
#tact-breadcrumbs .breadcrumbs-inner {
    width: auto !important;
}
#tact-breadcrumbs .breadcrumbs-inner ul {
    display: flex;
    list-style: none;
}
#tact-breadcrumbs .breadcrumbs-inner ul li {
    font-size: 1.2rem;
    padding-right: 2em;
    white-space: nowrap;
}
#tact-breadcrumbs .breadcrumbs-inner ul li::before {
    content: "";
    border-top: #ff6000 solid 2px;
    border-left: #ff6000 solid 2px;
    height: 0.6em;
    width: 0.6em;
    margin: auto;
    position: absolute;
    top: 0;
    right: 1em;
    bottom: 0;
    transform: rotate(135deg);
    opacity: 0.5;
}
#tact-breadcrumbs .breadcrumbs-inner ul li:last-child::before {
    display: none;
}
#tact-breadcrumbs .breadcrumbs-inner ul li a, #tact-breadcrumbs .breadcrumbs-inner ul li span {
    display: inline-block;
}
/* ================================================================
   #見出し
================================================================ */
.section-ttl {
    text-align: center;
    margin: 0 auto 60px;
    padding-top: 60px;
}
.section-ttl .font-eng {
    display: block;
    color: #ff6000;
    font-size: 2.4rem;
}
.section-ttl small {
    display: block;
    font-size: 1.4rem;
    font-weight: 600;
}
.section-ttl::before {
    content: " ";
    background: #ff6000;
    display: block;
    height: 30px;
    width: 1px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}
@media screen and (min-width: 1024px) {
    .section-ttl .font-eng {
        font-size: 4rem;
    }
    .section-ttl small {
        font-size: 1.8rem;
    }
}
.hatching-ttl {
    background-color: #ff6000;
    background-image: url("../img/theme/diagonal_line.png");
    background-repeat: repeat;
    border: #ff6000 2px solid;
    border-radius: 3px;
    color: #ff6000;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 20px;
    padding: .8em 1em;
}
@media screen and (min-width: 1024px) {
    .hatching-ttl {
        font-size: 1.8rem;
    }
}
.content-ttl {
    border-top: #ff6000 solid 1px;
    border-bottom: #EEE solid 4px;
    font-size: 2.2rem;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 30px;
    padding-top: 15px;
    padding-bottom: 15px;
}
.content-ttl small {
    display: block;
    font-size: 1.2rem;
}
@media screen and (min-width: 1024px) {
    .content-ttl {
        font-size: 2.8rem;
        margin-bottom: 50px;
        padding-top: 18px;
        padding-bottom: 18px;
    }
    .content-ttl small {
        display: inline;
        font-size: 1.4rem;
        padding-left: 2em;
    }
}
.page-intoro-ttl {
    color: #ff6000;
    font-size: 2rem;
    margin-bottom: 1em;
}
@media screen and (min-width: 1024px) {
    .page-intoro-ttl {
        font-size: 3.2rem;
    }
}
.page-intoro-txt.lage {
    font-size: 1.4rem;
    font-weight: 600;
}
@media screen and (min-width: 768px) {
    .page-intoro-txt.lage {
        font-size: 1.6rem;
    }
}
@media screen and (min-width: 1024px) {
    .page-intoro-txt {
        font-size: 1.6rem;
    }
    .page-intoro-txt.lage {
        font-size: 1.8rem;
    }
}
.font-color-1 {
    color: #ff6000;
}
.font-color-2 {
    color: #c585ff;
}
.font-color-3 {
    color: #00d3aa;
}
.font-color-4 {
    color: #ee76ad;
}
.font-color-5 {
    color: #ffb808;
}
#cursor {
    transform: translate(0, 0);
    pointer-events: none;
    position: fixed;
    top: -4px;
    left: -4px;
    width: 8px;
    height: 8px;
    background-color: #231815;
    mix-blend-mode: difference;
    border-radius: 50%;
    z-index: 999;
    transition: width .3s, height .3s, top .3s, left .3s;
}
#cursor.hov_ {
    top: -40px;
    left: -40px;
    width: 80px;
    height: 80px;
    background: rgba(255, 128, 0, 0.8);
}
/* Scss Document */
/* ================================================================
   #Blog：ブログ
================================================================ */
.loop-post .anime-item:nth-of-type(1), .loop-post .anime-item:nth-of-type(2), .loop-post .anime-item:nth-of-type(3) {
    opacity: 1 !important;
    transform: none !important;
}
/* ================================
   #Blog：ブログ：
================================ */
.post-container {
    background-color: #FFF;
    overflow: hidden;
}
.post-container .post-ttl {
    background-image: url("../img/theme/line_table_dot.svg");
    background-size: auto 1px;
    background-repeat: repeat-x;
    background-position: left bottom;
    font-size: 2rem;
    margin-bottom: 1em;
    padding-bottom: .5em;
}
.post-container time {
    color: #ff6000;
    font-size: 1.4rem;
    font-weight: 600;
    display: block;
    margin-bottom: 10px;
}
.post-container p {
    font-size: 1.4rem;
    line-height: 1.8;
}
.post-container a {
    text-decoration: underline;
    color: #ff6000;
}
.post-container a:hover {
    text-decoration: underline;
    color: royalblue;
}
.post-container img {
    display: inline;
    max-width: 100% !important;
}
@media screen and (min-width: 768px) {
    .post-container .post-ttl {
        font-size: 2.4rem;
    }
}
@media screen and (min-width: 1024px) {
    .post-container .post-ttl {
        font-size: 2.8rem;
    }
    .post-container p {
        font-size: 1.6rem;
    }
}
.post-container .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.post-container .alignleft {
    float: left;
    margin: 0.5em 1em 0.5em 0;
}
.post-container .alignright {
    float: right;
    margin: 0.5em 0 0.5em 1em;
}
.post-con-inner h1 {
    border: #231815 solid 2px;
    border-radius: 2px;
    border-radius: 2px;
    font-size: 1.8rem;
    padding: .75em 1em;
    margin: 0;
}
.post-con-inner h2 {
    background-color: #ff6000;
    border-radius: 2px;
    color: #FFF;
    font-size: 1.8rem;
    padding: .75em 1em;
    margin: 0;
}
.post-con-inner h3 {
    border-top: #231815 solid 1px;
    border-bottom: #231815 solid 1px;
    font-size: 1.8rem;
    padding: .75em 0;
    margin: 0;
}
.post-con-inner h4 {
    border-left: #231815 solid 4px;
    font-size: 1.8rem;
    padding-left: .5em;
    margin: 0;
}
.post-con-inner h5 {
    border-bottom: #231815 solid 2px;
    display: inline-block;
    font-size: 1.6rem;
    padding: 0 0 .5em 0;
    margin: 0;
}
.post-con-inner h6 {
    background-color: #FFB808;
    border-radius: 8px;
    display: inline-block;
    font-size: 1.6rem;
    line-height: 1.4;
    padding: .75em 1em;
    margin: 0;
}
.post-con-inner h6::before {
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: #FFB808 transparent transparent transparent;
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: -10px;
    left: 2em;
}
.post-con-inner ul, .post-con-inner ol {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 2em;
}
.post-con-inner ul li, .post-con-inner ol li {
    line-height: 1.4;
}
.post-con-inner ul li + li, .post-con-inner ol li + li {
    margin-top: .5em;
}
.post-con-inner table th, .post-con-inner table td {
    font-size: 1.2rem;
    height: auto !important;
    padding: 1em;
    margin-top: 0;
    margin-bottom: 0;
}
.post-con-inner hr {
    border: none;
    margin-top: 15px;
    margin-bottom: 15px;
    background-image: url("../img/theme/line_table_dot.svg");
    background-position: center top;
    background-size: auto 1px;
    background-repeat: repeat-x;
    height: 1px;
}
.post-con-inner blockquote {
    border: #DDD solid 1px;
    padding: 5vw;
    border-radius: 8px;
    max-width: calc(100% - 3em);
    margin-right: 0;
    margin-left: auto;
}
@media screen and (min-width: 768px) {
    .post-con-inner blockquote {
        padding: 32px;
    }
}
.btn-edit {
    border: #231815 solid 2px;
    border-radius: 2px;
    color: #231815 !important;
    text-decoration: none !important;
    display: inline-block;
    font-size: 1.4rem;
    margin-top: 30px;
    padding: .5em 2em;
}
.btn-edit:hover {
    border-color: royalblue !important;
    color: royalblue !important;
}
/* ================================
   #Blog：ブログ：サイド：リスト
================================ */
.sidebar-list {
    background-color: #F7F7F7;
    border-radius: 8px;
    list-style: none;
    margin: -2px;
    padding: 5vw;
}
.sidebar-list li {
    display: inline-block;
    float: left;
    padding: 2px;
}
.sidebar-list li a {
    background-color: #FFF;
    border-radius: 2px;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
    display: block;
    padding: .5em 1em;
}
.sidebar-list li a .categories-count {
    background-color: #F7F7F7;
    border-radius: 2px;
    color: rgba(0, 0, 0, 0.4);
    font-size: 1rem;
    display: inline-block;
    text-align: center;
    margin-left: 1em;
    padding: 5px 10px;
}
.sidebar-list li a:hover .categories-count {
    background-color: rgba(0, 0, 0, 0.2);
    color: #FFF;
}
@media screen and (min-width: 768px) {
    .sidebar-list {
        padding: 24px;
    }
    .sidebar-list li {
        padding: 2px;
    }
    .sidebar-list li a {
        font-size: 1.2rem;
        padding: .5em 1em;
    }
    .sidebar-list li a .categories-count {
        border-radius: 2px;
        font-size: 1.2rem;
        padding: 5px 10px;
    }
}
/* ================================
   #Blog：ブログ：サイド：カテゴリーリスト
================================ */
/* ================================
   #Blog：ブログ：サイド：年別・月別リスト
================================ */
/* ================================
   #Blog：ブログ：記事ページ送り
================================ */
.post-page-navi-wrap {
    border-top: #EEE solid 1px;
    border-bottom: #EEE solid 1px;
    padding: 16px 0;
}
.post-page-navi {
    display: flex;
    flex-wrap: wrap;
}
.post-page-navi .back-to-index {
    background-color: #4c4d55;
    border-radius: 4px;
    display: inline-block;
    color: #FFF;
    font-weight: 600;
    max-width: 100%;
    text-align: center;
    padding: 1em 3em;
    margin: auto;
    order: 3;
}
.post-page-navi .post-page-navi-item {
    display: flex;
    flex-wrap: wrap;
    flex-basis: 100%;
    max-width: 100%;
    padding: 1em 0;
}
.post-page-navi .post-page-navi-item.prev {
    order: 2;
}
.post-page-navi .post-page-navi-item.next {
    order: 1;
}
.post-page-navi .post-page-navi-item h4 {
    font-size: 1.2rem;
    line-height: 1.4;
    flex-basis: calc(100% - 80px);
    max-width: 75%;
    margin: auto;
    padding: 0 1em;
}
.post-page-navi .post-page-navi-item h4 small {
    display: block;
    font-size: 1rem;
    font-weight: normal;
    margin-bottom: 5px;
}
.post-page-navi .post-page-navi-item figure {
    background-color: #F4F4F4;
    background-image: url("../img/theme/img_post_thumb.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    height: 80px;
    flex-basis: 80px;
    max-width: 80px;
    overflow: hidden;
}
.post-page-navi .post-page-navi-item figure::before {
    content: "";
    background-color: #FFF;
    background-image: url("../img/theme/icon_arrow_b.svg");
    background-size: auto 12px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 100%;
    margin: auto;
    position: absolute;
    top: 10px;
    right: 10px;
    bottom: 10px;
    left: 10px;
}
.post-page-navi .post-page-navi-item.next figure::before {
    transform: rotate(-180deg);
}
.post-page-navi .post-page-navi-item:hover figure::before {
    display: none;
}
@media screen and (min-width: 768px) {
    .post-page-navi .back-to-index {
        flex-basis: 20%;
        max-width: 20%;
        padding: 2em 0;
        order: 2;
    }
    .post-page-navi .post-page-navi-item {
        flex-basis: 40%;
        max-width: 40%;
    }
    .post-page-navi .post-page-navi-item.prev {
        order: 3;
    }
    .post-page-navi .post-page-navi-item.next {
        order: 1;
    }
    .post-page-navi .post-page-navi-item h4 {
        font-size: 1.4rem;
    }
    .post-page-navi .post-page-navi-item h4 small {
        font-size: 1.2rem;
    }
}
/* ================================
   #Blog：ブログ：ページャー（プラグイン：WP-PageNavi）
================================ */
.wp-pagenavi-wrap {
    border-top: #EEE solid 1px;
    border-bottom: #EEE solid 1px;
    padding: 0;
}
.wp-pagenavi {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 auto;
    padding: 16px 0;
    width: 100%;
}
.wp-pagenavi a, .wp-pagenavi span {
    background-color: #DDD;
    border: transparent solid 1px !important;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 40px;
    height: 40px;
    padding: 0 !important;
    margin: 1px;
}
.wp-pagenavi a.current, .wp-pagenavi span.current {
    background-color: #4c4d55 !important;
    color: #FFF;
}
.wp-pagenavi a.extend, .wp-pagenavi span.extend {
    background-color: transparent;
    background-image: url("../img/theme/icon_extend.svg");
    background-size: auto 3px;
    background-position: center;
    background-repeat: no-repeat;
    color: rgba(0, 0, 0, 0);
}
.wp-pagenavi a:hover, .wp-pagenavi span:hover {
    background-color: #ff6000;
    color: #FFF;
}
.wp-pagenavi a:hover.extend, .wp-pagenavi span:hover.extend {
    background-color: transparent;
}
.wp-pagenavi .previouspostslink::before, .wp-pagenavi .nextpostslink::before {
    content: "";
    border-top: #231815 solid 2px;
    border-left: #231815 solid 2px;
    height: 8px;
    width: 8px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.wp-pagenavi .previouspostslink:hover, .wp-pagenavi .nextpostslink:hover {
    color: rgba(0, 0, 0, 0);
}
.wp-pagenavi .previouspostslink:hover::before, .wp-pagenavi .nextpostslink:hover::before {
    border-color: #FFF;
}
.wp-pagenavi .previouspostslink {
    color: rgba(0, 0, 0, 0);
}
.wp-pagenavi .previouspostslink::before {
    left: 3px;
    transform: rotate(-45deg);
}
.wp-pagenavi .nextpostslink {
    color: rgba(0, 0, 0, 0);
}
.wp-pagenavi .nextpostslink::before {
    right: 3px;
    transform: rotate(135deg);
}
@media screen and (min-width: 768px) {
    .wp-pagenavi a, .wp-pagenavi span {
        font-size: 1.2rem;
        width: 44px;
        height: 44px;
    }
}
/* ================================
   #Blog：ブログ：ループ
================================ */
.post-item {
    margin-bottom: 60px;
}
.btn-more-link {
    background-color: #ff6000;
    border: #ff6000 solid 2px;
    border-radius: 2px;
    display: block;
    color: #FFF;
    font-size: 1.2rem;
    text-align: center;
    margin: auto auto 0;
    padding: 5px 10px;
    width: 100%;
    max-width: 80%;
}
.post-item-link:hover .btn-more-link {
    background-color: #FFF;
    color: #ff6000;
}
.loop-post .btn-more-link {
    max-width: 50%;
}
.btn-index-link {
    background-color: #ff6000;
    border: #ff6000 solid 2px;
    border-radius: 2px;
    display: block;
    color: #FFF;
    font-size: 1.6rem;
    font-weight: 600;
    text-align: center;
    margin: 30px auto 0;
    padding: 1em 10px;
    width: 70%;
}
.btn-index-link:hover {
    background-color: #FFF;
    color: #ff6000;
}
@media screen and (min-width: 1024px) {
    .btn-index-link {
        width: 33.3337%;
    }
}
/* ================================
   #企業連携　202104～
================================ */
@media screen and (min-width: 768px) {
    span.title_2021 {
        font-size: 38px;
    }
}
.collaboration-item h3.h3_2021 {
    border-bottom: solid 4px;
    border-image: linear-gradient(to right, #f7b42c 0%, #f44336 100%);
    border-image-slice: 1;
    padding-bottom: 10px;
    margin-bottom: 1em;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
}
.color-theme_02 {
    color: #ff6000;
    background: -webkit-linear-gradient(-180deg, #ff6000, #f7b42c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.btm-mgn {
    margin-bottom: 40px;
}
.corporation-color {
    background-color: #fd7f34;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
}
.corporation-color ul li {
    display: inline-block;
    position: relative;

}
.e-sports {
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    justify-content: space-between;
}
div.play-style {
    background-color: #5a00a2;
    padding-top: 20px;
    padding-bottom: 10px;
    border-right: 2px solid #fff;
}
div.play-style h4 {
    text-align: center;
}
.tournament {
    padding-top: 20px;
    background-color: #222126;
}
div.tournament h4 {
    text-align: center;
}
.play-style img {
    max-width: 100%;
    margin-right: 5px;
}
@media screen and (max-width: 768px) {
    .e-sports img {
        max-width: 100%;
    }
}
.special-thacher {
    font-size: 12px;
}
.thacher-name {
    font-size: 28px;
}
.thacher_heading {
    display: inline-block;
    font-size: 16px;
    padding: 0 .8em .4em 2em;
    position: relative;
    color: #fff;
    z-index: 1;
    overflow: hidden;
    margin-top: 6px;
}
.thacher_heading::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background-color: #5a01a2;
    background: -moz-linear-gradient(left, rgb(255 188 0 / 0.7) 20%, rgb(90 1 162));
    background: -webkit-linear-gradient(left, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    background: linear-gradient(to right, rgb(118 5 125) 20%, rgb(90 1 162));
    transform: scaleY(1.3) perspective(.6em) rotateX(1deg);
    transform-origin: bottom right;
}
.special-thacher {
    border: solid 1px;
    padding: 2px 4px;
}
.thacher-div {
    text-align: right;
}
@media screen and (min-width:768px) and (max-width:1000px) {
    .karaage-thacher {
        font-size: 14px;
    }
    .special-karaage {
        font-size: 2px;
    }
}
@media screen and (min-width:768px) and (max-width:1200px) {
    h4.play-title {
        font-size: 1.1rem
    }
}
@media screen and (max-width:490px) {
    h4.play-title {
        font-size: 1rem
    }
}


.game_info {

}

.game_info .__inner {
	display: flex;
	align-items: center;
}

.game_info figure {
	margin-bottom: 16px!important;
}

.game_info h3 {
	color: #ff6000;
	font-size: 2.4rem;
	line-height: 1.2;
	margin-bottom: 16px!important;
}
.game_info .__inner p {
	font-size: 1.4rem;
	font-weight: 600;
	margin-bottom: 0;
	padding-left: 1em;
	width: 70%;
}
.game_logo {
	width: 30%;
}

.smalln {
	    font-size: 1.8rem!important;
}

@media screen and (min-width:768px) {

	.smalln {
	    font-size: 2.4rem!important;
}

	.game_info h3 {
	font-size: 4rem;
	margin-bottom: 16px!important;
}
.game_info .__inner p {
	width: 70%;
	font-size: 1.6rem;
	padding-left: 24px;
}
	.game_logo {
	width: 30%;
}

}
/* ================================
   #施設・設備紹介　202104～
================================ */
.facillity-photo-1 {
    text-align: center;
}
.photo_heading {
    font-size: 24px;
    background-color: #ff6000;
    background: -moz-linear-gradient(left, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    background: -webkit-linear-gradient(left, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    background: linear-gradient(to right, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    font-weight: 600;
    color: #FFF;
    display: inline-block;
    padding: .25em 1em;
    line-height: 1.5em;
    top: -1em;
}
.photo_heading:after {
    content: "";
    position: absolute;
    top: 0;
    left: -1.625em;
    width: 0;
    height: 0;
    margin: auto;
    border-style: solid;
    border-color: transparent rgb(255 188 0 / 0.7) transparent transparent;
    border-width: 1em .625em 1em 1em;
}
.photo_heading:before {
    content: "";
    position: absolute;
    right: -1.625em;
    top: 0;
    width: 0px;
    height: 1px;
    margin: auto;
    border-style: solid;
    border-color: transparent transparent transparent rgb(255 96 0 / 0.7);
    border-width: 1em 1em 1em .625em;
}
.explanation-center-in {
    top: -1.5em;
}
.explanation-center {
    text-align: center;
}
.photo_heading_02 {
    font-size: 24px;
    background-color: #ff6000;
    background: -moz-linear-gradient(left, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    background: -webkit-linear-gradient(left, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    background: linear-gradient(to right, rgb(255 188 0 / 0.7) 20%, rgb(255 96 0 / 0.7));
    font-weight: 600;
    color: #FFF;
    display: inline-block;
    text-align: center;
    padding: .25em 1em;
}
.photo_heading_02:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: -365px;
    width: 0px;
    height: 0px;
    margin: auto;
    border-style: solid;
    border-color: transparent rgb(254 209 99 / 1) transparent transparent;
    border-width: 25px 15px 25px 25px;
}
.photo_heading_02:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 325px;
    width: 0px;
    height: 0px;
    margin: auto;
    border-style: solid;
    border-color: transparent transparent transparent rgb(255 144 90);
    border-width: 25px 25px 25px 15px;
}
@media screen and (min-width:768px) and (max-width:1335px) {
    .facillity-photo-4-2021 {
        max-width: 70%;
    }
}
/* ================================
   #就職サポート　202104～
================================ */
@media screen and (min-width:768px) {
    .employment_row-reverse {
        display: flex;
        flex-direction: row-reverse;
    }
}
/* ================================
   #資格・コンテスト　202104～
================================ */
h3.lpic {
    font-size: 24px;
}
@media screen and (max-width: 767px) {
    .lpic-img {
        max-width: 200px;
        margin: 0 auto;
    }
}
.award-section {
    justify-content: space-between;
}
.award-qua {
    background-color: #9e9e9e40;
}
.award-qua h3 {
    margin-top: 10px;
    font-size: 1.8rem;
    padding-bottom: 15px;
    border-bottom: solid 1px #9E9E9E;
    margin-bottom: 15px;
}
.award-qua h4 {
    font-size: 1.6rem;
    margin-top: 15px;
    margin-bottom: 5px;
}
.award-container {
    width: 100%;
    justify-content: space-between;
}
.award-item {
    margin: 1%;
}
.award-item h3 {
    font-size: 1.8rem;
    padding-bottom: 15px;
}
.award-item h4 {
    font-size: 1.6rem;
    margin-top: 15px;
    margin-bottom: 5px;
}
.award-item {
    width: 30%;
    float: left;
    border-radius: 6px;
    overflow: hidden;
    background-color: #FFF;
}
.item-inner {
    padding: 30px;
}
.item-inner hr {
    width: calc(100% + 60px);
    left: -30px;
    background: none;
    border-bottom: 1px solid #e8e8e8;
}
@media screen and (max-width: 767px) {
    .award-item {
        width: 100%;
        padding-bottom: 40px;
    }
}
.award_waku {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
}
.award {
    display: block;
    position: relative;
    width: 30%;
    margin-bottom: 80px;
}
img.award_medal,
img.award_medal2 {
    width: 32px;
}

.award_ttl {
	color: #ff6000;
	   display: flex;
	align-items: center;
    font-size: 20px;
	font-feature-settings: "palt";
    line-height: 1.4;
	margin-top: 16px;
	margin-bottom: 16px;
}

span.award_title_black {
	border-bottom: #333 solid 1px;
    display: block;
    font-size: 14px;
	font-weight: 600;
    line-height: 1.4;
	padding-bottom: .5em;
}
.award_title_bold {

}
.award_ttl img {
	display: block;
	margin-right: 12px;
}

p.award_text {
    display: block;
    color: #333333;
    font-size: 14px;
    line-height: 170%;
    text-align: justify;
    margin: 16px 0 0 0;
}

.award_name {
	border-left: #CCC solid 1px;
    padding-left: 1em;
	font-weight: bold;
	margin-top: .5em;
}
.award_name small {
	display: block;
	font-size: 12px;
	font-weight: normal;
}

p.award_text strong {
	font-size: 16px;
}


span.award_text_title {
    display: block;
    font-weight: bold;
	    margin-bottom: .5em;
    font-size: 16px;
}
.students_voice {
    display: block;
    width: 90%;
    margin: 5% auto;
    background-color: #ffc778;
    padding: 5%;
}
p.students_voice_text {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 160%;
    text-align: justify;
}
span.students_voice_title {
    display: block;
    width: 90%;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5%;
}
@media screen and (max-width: 790px) {
    .award_waku {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
    .award {
        position: relative;
        width: 100%;
    }

	img.award_medal,
img.award_medal2 {
    width: 40px;
}

.award_ttl {

    font-size: 24px;

}
}
@media screen and (min-width: 800px) {
    .award {
        display: block;
        position: relative;
    }

  .award_ttl {
        font-size: 20px;
    }
}
@media screen and (min-width: 1200px) {
    .award {
        display: block;
        position: relative;
    }

    .award_ttl {
        font-size: 24px;
    }
}
h4.jisseki {
    margin-top: 0px;
    font-weight: 100;
    font-size: 14px;
}
@media screen and (max-width: 767px) {
    h4.jisseki {
        font-size: 12px;
    }
}
.more-small {
    font-size: 70px;
}
/* ================================
   #最新・最先端技術を学ぶ　202104～
================================ */
h3 small.la_tec-small {
    margin-bottom: 0px;
    color: #231815;
}
.color-theme_02 ruby rb {
    color: #ff6000;
    background: -webkit-linear-gradient(-180deg, #ff6000, #f7b42c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.color-theme_02 ruby rt {
    color: #ff6000;
    background: -webkit-linear-gr1adient(-180deg, #ff6000, #f7b42c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.kakomi {
    border: #231815 1px solid;
    text-align: center;
    margin: 20px;
    padding: 20px;
    margin-bottom: 40px;
}
.red-line {
    background-color: #ff3434;
    color: #fff;
    font-size: 34px;
}
@media screen and (max-width: 767px) {
    .red-line {
        font-size: 22px;
    }
}
.kakomi .wf_col-66-sm {
    text-align: left;
}
.kakomi .wf_col-33-sm {
    text-align: right;
}
.color-green {
    font-size: 110%;
    color: #0c6531;
    border: 0px;
}
.color-red {
    color: #b91f43;
    border: 0px;
}
.color-blue {
    color: #29379a;
    border: 0px;
}
.collaboration-item h3 {
    border-bottom: 0px;
    padding-bottom: 0px;
    margin-bottom: 0em;
}
.bgcolor-green {
    background: #0c6531;
    /*
  background: -moz-linear-gradient(left,rgb(255 235 59 / 0.4),#e5f1e7 30%,#18a954);
  background: -webkit-linear-gradient(left,rgb(255 235 59 / 0.4),#e5f1e7 30%,#18a954);
  background: linear-gradient(to left,rgb(255 235 59 / 0.4),#e5f1e7 10%,#17924a);
  padding: 15px 30px 5px;
  margin-top: 5px;
  margin-bottom: 20px;*/
}
.bgcolor-red {
    background: #b91f43;
    /* background: -moz-linear-gradient(left,rgb(251 246 199 / 60%),#f7d6d6 10%,#dc1d49);
  background: -webkit-linear-gradient(left,rgb(251 246 199 / 60%),#f7d6d6 10%,#dc1d49);
  background: linear-gradient(to left,rgb(251 246 199 / 60%),#f7d6d6 10%,#dc1d49);
  padding: 30px;
  margin-bottom: 20px; */
}
.bgcolor-blue {
    background: #29379a;
    /*  background: -moz-linear-gradient(left,rgb(255 235 59 / 0.4),#e5f1e6 10%,#0f1961);
  background: -webkit-linear-gradient(left,rgb(255 235 59 / 0.4),#e5f1e6 10%,#0f1961);
  background: linear-gradient(to left,rgb(255 235 59 / 0.4),#e5f1e6 10%,#0f1961);
  padding: 30px;
  margin-bottom: 20px;*/
}
.textcolor-white {
    color: white;
}
@media screen and (max-width: 767px) {
    h3.no-border {
        font-size: 38px;
    }
}
.channel {
    text-align: center;
}
/*    kinjo_start */
.bgcolor-green, .bgcolor-red, .bgcolor-blue {
    padding: 15px 30px 5px;
    margin-top: 5px;
    margin-bottom: 20px;
}
.come-figu {
    margin-top: 15px;
}
.latest__voice {
    padding: 30px 0 0;
    border-top: 10px double #000;
    border-bottom: 10px double #000;
}
.latest__voice h3 {
    margin-bottom: 10px;
    padding: 5px 0 5px 10px;
    color: #fff;
    background: #000;
    position: relative;
}
.latest__voice h3 span.sub {
    padding-left: 20px;
    display: inline-block;
}
.latest__voice strong {
    padding-bottom: 10px;
    font-size: 2rem;
    display: block;
}
.con-copy-txt.t-right {
    margin-top: 30px;
    text-align: right
}
.pickup {
    padding: 0;
}
.pickup .flex {
    padding-left: 30px;
    display: flex;
    justify-content: space-between;
}
.pickup .flex figure {
    width: 48%;
}
.bg-orange {
    max-height: 218px;
    padding: 20px 20px 0;
    text-align: center;
    background: #fe9826;
}
.pickup .bg-orange h3 {
    margin: -50px 0 0;
    text-align: left;
    font-size: 38px;
}
.bg-orange strong {
    margin-top: 10px;
    padding: 0 15px;
    font-size: 28px;
    color: #fe9826;
    line-height: 2.4rem;
    background: #fff;
}
.bg-orange p {
    color: #fff;
}
.bg-orange p:last-of-type {
    margin-top: 20px;
    padding-bottom: 0;
}
.pickup strong.t-center {
    margin: 10px auto;
    text-align: center;
    font-size: 38px;
    display: block;
}
.wf_col-33-sm.pt10 {
    position: relative;
}
@media screen and (min-width: 768px) {
    .wf_col-33-sm.pt10 img {
        position: relative;
        top: -20px;
    }
}
.sp-image {
    display: none
}
@media screen and (max-width: 768px) {
    .bg-orange {
        margin-bottom: 20px;
    }
    .sp-image {
        display: block
    }
    .pc-image {
        display: none
    }
    .wf_col-33-sm.pt10 img {
        margin-bottom: 20px;
        position: relative;
        top: 0;
    }
}
/* ================================
   #学科コース　202104～
================================ */
#curricurum_schedule .curricurum_schedule_item h1 {
    background-color: #c585ff;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_characterdesign .curricurum_schedule_item h1 {
    background-color: #00a040;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_game .curricurum_schedule_item h1 {
    background-color: #ee76ad;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_cg .curricurum_schedule_item h1 {
    background-color: #ffb806;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_it .curricurum_schedule_item h1 {
    background-color: #00b5ed;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_it .curricurum_schedule_item-2024 h1 {
    background-color: #006FBC;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_information .curricurum_schedule_item h1 {
    background-color: #00d3aa;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
#curricurum_schedule_esports .curricurum_schedule_item h1 {
    background-color: #ff6000;
    border-radius: 4px;
    padding: .5em 1em;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
.curricurum_schedule_item h2 {
    background-color: #231815;
    border-radius: 100px;
    padding: .5em 1em;
    font-size: 1.6rem;
    line-height: 1.4;
    color: #FFF;
    text-align: center;
}
.wave-wrap i, .wave-wrap strong {
    opacity: 0;
}
.wave-wrap .wave {
    opacity: 0;
    top: .4em;
    transition: 0.13s all;
}
/*    kinjo_start */
#pickup-section .wf_container {
    padding: 30px 50px;
}
#pickup-section .wf_row {
    display: flex;
    justify-content: space-around;
}
#pickup-section article {
    box-shadow: 0 2rem 4rem hsl(0 0% 0% / 20%);
    padding: 0;
    border: 1px solid #f4f4f4;
    background: #fff;
    position: relative;
}
#pickup-section .wf_container .pickup-content {
    width: 90%;
    height: auto;
    margin: 0 5%;
    position: relative;
    top: -30px;
    background: none;
}
#pickup-section article h4 {
    margin-top: 10px;
    text-align: center;
}
#pickup-section article i {
    width: 50px;
    margin: 0 auto;
    text-align: center;
    display: block;
}
#pickup-section .pickup-thumb {
    max-height: 205px;
    position: relative;
    overflow: hidden;
}
#pickup-section .pickup-thumb figcaption {
    height: 12%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    display: block;
}
#pickup-section article i img, #pickup-section {
    width: 100%;
    height: auto;
}
.pickup-thumb figcaption img {
    width: auto;
    height: 100%;
}
@media screen and (max-width: 768px) {
    #pickup-section .wf_container {
        width: 90%;
        margin-bottom: 50px;
        padding: 30px 30px 0;
    }
    #pickup-section article h4 {
        font-size: 18px;
    }
    #pickup-section article p {
        font-size: 14px;
    }
}
.anime_number {
    display: block;
    position: absolute;
    width: 100%;
    top: 0;
    text-align: center;
    opacity: 1;
    transition: all 1.3s ease-in-out 0.2s;
    transform: translateY(0);
    z-index: 99999;
}
.anime_number.active_number {
    transform: translateY(-500px);
    opacity: 1;
}
.anime_number2 {
    display: block;
    position: absolute;
    width: 100%;
    top: 0;
    text-align: center;
    opacity: 1;
    transition: all 0.3s ease-in-out 0.2s;
    transform: translateY(0);
    z-index: 999999;
}
.anime_number2.active_number2 {
    transform: translateY(-300px);
    opacity: 1;
}
.anime_number3 {
    display: block;
    position: absolute;
    width: 80%;
    top: 0;
    left: 10%;
    text-align: center;
    opacity: 1;
    transition: all 3.2s ease-in-out 0.2s;
    transform: translateY(0);
    z-index: 99999;
}

.anime_number3.active_number3 {
    transform: translateY(-700px);
    opacity: 1;
}
.anime_number4 {
    display: block;
    position: absolute;
    width: 80%;
    top: 0;
    left: 10%;
    text-align: center;
    opacity: 1;
    transition: all 2s ease-in-out 0.3s;
    transform: translateY(0);
    z-index: 999999;
}
.anime_number4.active_number4 {
    transform: translateY(-800px);
    opacity: 1;
}

/* ================================
   オープンキャンパス-学生の声
================================ */
#oc-voice ul{
  list-style: none;
  margin-bottom: 40px;
}
#oc-voice li + #oc-voice li {
  margin-top: 5px;
}
#oc-voice li {
  position: relative;
  padding-left: 40px;
}
#oc-voice li:not(:last-child) {
  margin-bottom: 20px;
}
#oc-voice li:before {
  content: "";
  position: absolute;
  width: 9px;
  height: 15px;
  top: 0.32em;
  left: 8px;
  -webkit-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  transform: rotate(50deg);
  border-right: 3px solid #FF6000;
  border-bottom: 3px solid #FF6000;
}
#oc-voice li:after {
  content: "";
  position: absolute;
  top: .1em;
  left: 0;
  width: 25px;
  height: 25px;
  border: 1px solid #FF6000;
}
#oc-voice li p{
  font-size: 1.2em;
}
#oc-voice li span{
  font-size: 1.4rem;
  font-weight: normal;
  display: block;
}

/* ================================
   学生作品
================================ */
.works{
  margin-bottom: 80px;
}
.works-list {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}
.works-list li {
  margin-top: 1%;
}
.works-list li p{
  padding: 5px 5px 0 5px;
  font-weight: 600;
}
.works-list a img{
  width: 100%;
  height: 240px;
  object-fit: cover;
  object-position: top center;
  font-family: 'object-fit: cover; object-position: top center'
}
.works-list li p span{
  position: relative;
}
.works-list li p span::after {
  content: "";
  display: block;
  position: absolute;
  width: 13px;
  height: 19px;
  background: url(../img/works/popup.svg) no-repeat center center / 12px 12px;
  bottom: 0;
  margin: auto;
  right: -18px;
  transition: right .3s;
}
/*font*/
.works-ttl {
  font-size: 2.4rem;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 1em;
}
.works-ttl span {
  display: inline-block;
  font-weight: 800;
  letter-spacing: .15em;
  padding-left: .15em;
}
.works-ttl span::before {
  left: -2em;
}
.works-ttl span::after {
  right: -2em;
}
.works-ttl .font-jp {
  display: block;
  font-size: 1.4rem;
  margin-top: .5em;
}
@media screen and (min-width: 768px){
.works-ttl {
  font-size: 4rem;
}
.works-ttl .font-jp {
  font-size: 1.8rem;
}
}
@media screen and (max-width: 767px){
.works-list li {
  width: 49.5%;
}
.works-list li:not(:nth-child(2n)) {
  margin-right: 0.5%;
}
.works-list li p {
  padding: 3px 5px 0 5px;
}
.works-list a img {
  height: 200px;
}
.lightcase-contentInner img{
  max-height: 500px!important;
}
#lightcase-info {
  padding-top: 10px;
  width: 100%;
  text-align: center;
}
a[class*='lightcase-icon-'].lightcase-icon-prev,a[class*='lightcase-icon-'].lightcase-icon-next {
  width: 50%;
  height: 80px;
}
.lightcase-icon-prev:before{
  position: absolute;
  left: 0;
  bottom: 10px;
}
.lightcase-icon-next:before{
  position: absolute;
  right: 0;
  bottom: 10px;
}
.works-list li {
  margin-top: 2%;
}
.works-list li p span::after {
  height: 15px;
}
}
@media screen and (min-width:768px) and ( max-width:1023px) {
.works-list li {
  width: 33%;
}
.works-list li:not(:nth-child(3n)) {
  margin-right: 0.5%;
}
}
@media screen and (min-width:1024px) and ( max-width:1366px) {
.works-list li {
  width: 24.625%;
}
.works-list li:not(:nth-child(4n)) {
  margin-right: 0.5%;
}
}
@media screen and (min-width: 1366px){
.works-list li {
  width: 19.6%;
}
.works-list li:not(:nth-child(5n)) {
  margin-right: 0.5%;
}
}
@media screen and (max-height: 640px){
.lightcase-contentInner img {
  max-height: 350px!important;
}
}
.works-list li p{
  padding: 3px 5px!important;
  font-weight: 600;
}
.award-box p{
  background: #ff6000;
  color: #fff;
  display: inline;
  line-height: 220%;
  font-size: 1.2rem;
}
.works-textbox{
  padding: 5px 3px;
}
@media screen and (max-width: 767px){
.award-box p{
  padding: 3px 5px!important;
}
}
.award-box {
  position: relative;
}
.award-box p{
  position: absolute;
  color: white;
  background: #ff6000;
  line-height: 160%;
  font-size: 1.2rem;
  bottom: 0;
  left: 0;
  width: 100%;
}
.award-box img {
  width: 100%;
}

/*=====================================
  目指せる職種
 =====================================*/
 .jobcate_wrap {
	margin-top: 48px;
}
.jobcate_ttl {
  background-color: #FFF;
  border: #E4E4E4 solid 1px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 1.6rem;
  padding: 1em 48px 1em 1em;
  z-index: 2;
}
.jobcate_ttl:hover {
  background-color: #F4F4F4;
  border-color: #F4F4F4;
}
.jobcate_ttl > span {
  display: block;
  flex-basis: calc(100% - 40px);
  max-width: calc(100% - 40px);
}
.jobcate_ttl::before, .jobcate_ttl::after {
  content: "";
  background-color: #222222;
  height: 2px;
  width: 12px;
  margin: auto;
  position: absolute;
  top: 0;
  right: 24px;
  bottom: 0;
}
.jobcate_ttl::after {
  transform: rotate(90deg);
}
.jobcate_ttl.__js_is_open {
  background-color: #F4F4F4;
  border-color: #F4F4F4;
}
.jobcate_ttl.__js_is_open::after {
  display: none;
}
.jobcate_content {
  z-index: 2;
}
.jobcate_content p {
  background-color: #FFF;
  font-size: 1.4rem;
  line-height: 1.8;
}
.jobcate_content .wf_btn-wrap {
  margin-top: 10px;
}
.jobcate_content .wf_btn-wrap + .wf_btn-wrap {
  margin-top: 12px;
}
.__js_is_open + .js_acc_item .jobcate_content {
  animation-name: acc_anime;
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
  animation-fill-mode: both;
}
.jobcate_content img{
  margin: 0 auto;
  border-radius: 8px;
}
.jobcate_wrap .js_acc_item{
  margin: 20px 0 48px;
}
.jobcate_content h4{
  border-bottom: 1px solid #F4F4F4;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.jobcate_txt{
  margin-top: 20px;
}
.jobcate_btn{
  list-style: none;
}
.jobcate_btn a{
  width: 100%;
  border-radius: 4px;
  min-height: 60px;
}
.jobcate_btn .btn-arrow{
  margin: 0 auto;
}
.jobcate_btn .btn-arrow span{
  display: block;
  font-size: 1.2rem;
  font-weight: normal;
}
.jobcate-img{
  position: relative;
}
.jobcate-catch{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}
.jobcate-catch span{
  background: #231815;
  color: #fff;
  font-size: 2.5rem;
  font-weight: 600;
  padding: 7px 15px;
  display: inline-block;
  line-height: 130%;
}
.jobcate_wrap .photo-box {
  margin-right: 0;
  margin-left: 0;
}
.jobcate_wrap .photo-box figure {
  width: 100%;
  padding-top: 53.25%;
}
/*AI・IT業界*/
.jobcate_aiit .color_ttl,
.jobcate_aiit .photo-anime .photo-anime-layer{
  background: #C585FF;
}
.jobcate_aiit .jobcate_ttl.__js_is_open,
.jobcate_aiit .jobcate_ttl:hover,
.jobcate_aiit .jobcate_content h4{
  color: #C585FF;
}
/*ゲーム・eスポーツ業界*/
.jobcate_game .color_ttl,
.jobcate_game .photo-anime .photo-anime-layer{
  background: #EE76AD;
}
.jobcate_game .jobcate_ttl.__js_is_open,
.jobcate_game .jobcate_ttl:hover,
.jobcate_game .jobcate_content h4{
  color: #EE76AD;
}
/*CG・デザイン業界*/
.jobcate_cg .color_ttl,
.jobcate_cg .photo-anime .photo-anime-layer{
  background: #ffb808;
}
.jobcate_cg .jobcate_ttl.__js_is_open,
.jobcate_cg .jobcate_ttl:hover,
.jobcate_cg .jobcate_content h4{
  color: #ffb808;
}
/*AIシステム科*/
.jobcate_btn_ai{
  background: #C585FF;
}
.jobcate_btn_ai:hover{
  background: linear-gradient(45deg, #C585FF 20%, #ff6000, #c585ff 80%);
  background-size: 500% 500%;
  animation: AnimationName .8s ease 1 forwards;
}
/*情報システム科*/
.jobcate_btn_info{
  background: #00d3aa;
}
.jobcate_btn_info:hover{
  background: linear-gradient(45deg, #00d3aa 20%, #ff6000, #c585ff 80%);
  background-size: 500% 500%;
  animation: AnimationName .8s ease 1 forwards;
}
/*ゲームクリエーター科*/
.jobcate_btn_game{
  background: #EE76AD;
}
.jobcate_btn_game:hover{
  background: linear-gradient(45deg, #EE76AD 20%, #ff6000, #c585ff 80%);
  background-size: 500% 500%;
  animation: AnimationName .8s ease 1 forwards;
}
/*CG･Webクリエーター科*/
.jobcate_btn_cg{
  background: #ffb808;
}
.jobcate_btn_cg:hover{
  background: linear-gradient(45deg, #ffb808 20%, #ff6000, #c585ff 80%);
  background-size: 500% 500%;
  animation: AnimationName .8s ease 1 forwards;
}
/*CG･Webクリエーター科*/
.jobcate_btn_esports{
  background: #ff6000;
}
.jobcate_btn_esports:hover{
  background: linear-gradient(45deg, #ff6000 20%, #ff6000, #c585ff 80%);
  background-size: 500% 500%;
  animation: AnimationName .8s ease 1 forwards;
}
@media screen and (min-width: 768px) {
.jobcate_ttl {
  font-size: 1.8rem;
  padding: 1em 64px 1em 1.25em;
}
.jobcate-lead-ttl {
	text-align: center;
	margin-bottom: 32px;
}
.jobcate-all{
  display: flex;
  flex-wrap: wrap;
}
.jobcate-list{
  width: 49%;
  margin-bottom: 2%;
}
.jobcate-list:nth-child(odd){
  margin-right: 2%;
}
.jobcate_btn{
  display: flex;
}
.jobcate_btn li{
  width: 49%;
}
.jobcate_btn li:not(:last-child){
  margin-right: 2%;
}
}
@media screen and (max-width: 767px){
.jobcate-list{
  margin-bottom: 20px;
}
.jobcate-catch span {
  font-size: 1.8rem;
}
}
/* ================================================================
   LINEブログ
================================================================ */
.pickup-cate .news-item-cat{
  display: none;
}



/* 20220406追加 */

.employment_logo .sp{
    display: none;
}

.employment_field{
    max-width: 500px;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    margin: 100px auto 20px;
    padding: 5px 0;
}

.game_info_copy{
    margin-top: 40px;
    font-size: 11px;
    text-align: right;
}

.award_last{
    margin-left: 3%;
}

.award_field{
    font-weight: 600;
    text-align: center;
    color: #fff;
    border-radius: 2px;
    padding: 4px 1em;
    margin-bottom: 10px;
}






.obogfile{
    padding-top: 140px;
}

.obogfile_box{
    margin-top: 80px;
}

.obogfile_box .obogfile_field{
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    padding: 5px 0;
    margin-bottom: 40px;
}

.obogfile_box li{
    margin-bottom: 60px;
    overflow: hidden;
}

.obogfile_box li:last-child{
    margin-bottom: 0;
}

.obogfile_box li .obogfile_img{
    float: left;
    width: 48%;
}

.obogfile_box li .obogfile_txt{
    float: right;
    width: 48%;
}

.obogfile_box li:nth-child(2n) .obogfile_img{
    float: right;
}

.obogfile_box li:nth-child(2n) .obogfile_txt{
    float: left;
}

.obogfile_box li .obogfile_txt .obogfile_companyname{
    font-size: 18px;
    margin-top: 10px;
}

.obogfile_box li .obogfile_txt .obogfile_name{
    margin-top: 20px;
}

.obogfile_box li .obogfile_txt .obogfile_name span{
    font-size: 28px;
}

.obogfile_box li .obogfile_txt .obogfile_from{
    margin-top: 5px;
}

.obogfile_box li .obogfile_txt p{
    margin-top: 20px;
}





.corporation_guidance{
    margin-top: 100px;
}

.corporation_guidance_box{
    margin-bottom: 80px;
    overflow: hidden;
}

.corporation_guidance_person{
    float: left;
    width: 30%;
    position: relative;
}

.corporation_guidance_person .person_info{
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 9;
    background: #231815;
    color: #fff;
    padding: 10px;
}

.corporation_guidance_person .person_info span{
    font-size: 150%;
    display: block;
}


.corporation_guidance_inner{
    float: right;
    width: 66%;
}

.corporation_guidance_box h4{
    font-size: 32px;
    line-height: 1.4em;
}

.corporation_guidance_box h4.sp{
    display: none;
}

.corporation_guidance_box h4 img{
    display: inline-block;
    vertical-align: middle;
    width: 100px;
}

.corporation_guidance_box h4 span{
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.5em;
}

.corporation_guidance_content{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 20px;
}

.corporation_guidance_content .img{
    width: 52%;
}

.corporation_guidance_content .img .copy{
    font-size: 11px;
    text-align: right;
}

.corporation_guidance_company{
    width: 45%;
    padding-left: 5%;
    margin-top: 20px;
}

.corporation_guidance_logo{
    text-align: center;
}

.corporation_guidance_logo img{
    margin: 0 auto;
}

.corporation_guidance_txt{
    margin-top: 20px;
}

.corporation_guidance_txt h5{
    font-size: 16px;
    text-align: center;
}

.corporation_guidance_txt p{
    margin-top: 10px;
}

.corporation_guidance_box4 .corporation_guidance_company{
    margin-top: 80px;
}


.technology_5g{
    padding: 40px 0 100px;
}

.technology_5g h3{
    font-size: 38px;
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1.4em;
    text-align: center;
}

.technology_5g_box{
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.technology_5g_box .docomo{
    width: 45%;
    padding-right: 5%;
}

.technology_5g_box .docomo p{
    font-size: 18px;
    font-weight: bold;
    margin-top: 20px;
}

.technology_5g_classroom{
    width: 55%;
}

.technology_5g_classroom h4{
    background: #e95513;
    color: #fff;
    font-size: 18px;
    text-align: center;
    padding: 5px 0;;
}

.technology_5g_classroom ul{
    margin-top: 20px;
}

.technology_5g_classroom li{
    margin-bottom: 20px;
    overflow: hidden;
}

.technology_5g_classroom li:last-child{
    margin-bottom: 0;
}

.technology_5g_classroom li .img{
    float: left;
    width: 48%;
}

.technology_5g_classroom li .txt{
    float: right;
    width: 48%;
}

.technology_5g_classroom li .txt h5{
    font-size: 16px;
}

.technology_5g_feature{
    margin-top: 100px;
}

.technology_5g_feature h4{
    font-size: 38px;
    text-align: center;
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1.4em;
    text-align: center;
}

.technology_5g_feature ul{
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.technology_5g_feature li{
    width: 30%;
    margin-right: 5%;
    /* overflow: hidden; */
    list-style: none;
}

.technology_5g_feature li:last-child{
    margin-right: 0;
}

.technology_5g_feature li h5{
    background: #e95513;
    color: #fff;
    font-size: 18px;
    text-align: center;
    padding: 5px 0;
}

.technology_5g_feature li .img{

}

.technology_5g_feature li p{
    margin-top: 10px;
}

.technology_5g_feature_txt{
    background: #ff3434;
    color: #fff;
    font-size: 34px;
    text-align: center;
    margin-top: 40px;
    padding: 5px 0;
}




.metaverse .metaverse_read{
    margin-top: 20px;
    font-size: 1.6rem;
}


.metaverse_box1{
    margin-top: 40px;
    padding: 0 1.25vw;
}

.metaverse_box1 .logo{
    text-align: center;
}

.metaverse_box1 .logo img{
    margin: 0 auto;
}

.metaverse_box1 .inner{
    margin-top: 40px;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.metaverse_box1 .inner .txt{
    background: #231815;
    color: #fff;
    padding: 10px;
    text-align: center;
    font-size: 16px;
}

.metaverse_box1 .inner .txt span{
    font-size: 150%;
}

.metaverse_box1 .inner1{
    width: 50%;
    padding-right: 2%;
}

.metaverse_box1 .inner2{
    width: 50%;
    padding-left: 2%;
    position: relative;
}

.metaverse_box1 .inner2 .txt{
    position: absolute;
    left: 4%;
    bottom: 65px;
}


.metaverse_box2{
    margin: 60px 0 100px;
}

.metaverse_box2 p{
    margin-top: 20px;
    font-size: 1.6rem;
}

.metaverse_box2 ul{
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.metaverse_box2 li{
    width: 32%;
    margin-right: 2%;
    list-style: none;
}

.metaverse_box2 li:last-child{
    margin-right: 0;
}




.vtuber_special{
    margin-bottom: 60px;
}

.vtuber_special h4{
    font-size: 34px;
    line-height: 1.4em;
    margin-bottom: 20px;
}

.vtuber_special .vtuber_special_read{
    font-size: 1.6rem;
}

.vtuber_special .box1 ul{
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.vtuber_special .box1 li{
    margin-left: 2%;
    list-style: none;
}

.vtuber_special .box1 li.list1{
    width: 28%;
    margin-left: 0;
}

.vtuber_special .box1 li.list2{
    width: 28%;
}

.vtuber_special .box1 li.list2 p{
    margin-top: 10px;
    line-height: 1.4em;
}

.vtuber_special .box1 li.list3{
    width: 40%;
}



.vtuber_special .box2{
    margin-top: 60px;
}

.vtuber_special .box2 ul{
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.vtuber_special .box2 li{
    width: 22%;
    margin-right: 4%;
    list-style: none;
}

.vtuber_special .box2 li:last-child{
    margin-right: 0;
}

.vtuber_special .box2 li h5{
    /* margin-top: 10px; */
    text-align: center;
    font-size: 1.8rem;
    line-height: 1.4em;
    background: #231815;
    color: #fff;
    padding: 10px 0;
}



.vtuber_special .box3{
    margin-top: 60px;
}

.vtuber_special .box3 .img{
    margin-top: 40px;
}



.corporation_picup_block{
	margin-top:20px;
}

.corporation_picup .box{
	margin-top: 20px;
	overflow:hidden;
}

.corporation_picup_block h4{
	background:#231815;
	padding: 0 1em;
	color: #fff;
	font-size: 1.8rem;
	display:inline-block;
}

.corporation_picup_block h4 img{
	display:inline-block;
	vertical-align:middle;
	margin-right: 10px;
}

.corporation_picup_block h4 strong{
	font-size:120%;
	margin-left:1em;
}

.corporation_picup .box .inner{
	width:48%;
	float:left;
}

.corporation_picup .box .inner:last-child{
	float:right;
}

.corporation_picup .box .inner .txt{
	margin-top:20px;
}

.corporation_picup .box .inner .txt h5{
	font-size:20px;
	margin-bottom: 10px;
}


.corporation_company_list{
}

.corporation_company_list_inner{
	margin-top:40px;
}

.corporation_company_list_inner h4{
	background: #ea5514;
	color: #fff;
	display:inline-block;
	padding:0 1em;
	margin-bottom: 0;
}

.corporation_company_list_inner ul{
	margin-top:10px;
	overflow:hidden;
}

.corporation_company_list_inner li{
	float:left;
	margin-right:1em;
	list-style:none;
}



@media screen and (max-width: 767px){

.employment_field{
    margin-top: 60px;
    font-size: 16px;
}

.employment_logo .sp{
    display: block;
}

.employment_logo .pc{
    display: none;
}

.game_info_copy{
    margin-top: 20px;
}

.game_info_copy .pc{
    display: none;
}

.award_last{
    margin-left: 0;
}





.obogfile{
    padding-top: 60px;
}

.obogfile_box {
    margin-top: 40px;
}

.obogfile_box li{
    margin-bottom: 40px;
}

.obogfile_box li .obogfile_img{
    float: none;
    width: auto;
}

.obogfile_box li .obogfile_txt{
    float: none;
    width: auto;
    margin-top: 20px;
}

.obogfile_box li:nth-child(2n) .obogfile_img{
    float: none;
}

.obogfile_box li:nth-child(2n) .obogfile_txt{
    float: none;
}

.obogfile_box li .obogfile_txt .obogfile_companyname{
    font-size: 16px;
}

.obogfile_box li .obogfile_txt .obogfile_name span{
    font-size: 22px;
}




.corporation_guidance {
    margin-top: 50px;
}

.corporation_guidance_box {
    margin-bottom: 40px;
}

.corporation_guidance_person{
    float: none;
    width: 60%;
    margin: 0 auto;
}

.corporation_guidance_inner {
    float: none;
    width: auto;
    padding: 0 4%;
}

.corporation_guidance_box h4{
    font-size: 17px;
    padding: 0 4%;
}

.corporation_guidance_box h4.sp{
    display: block;
}

.corporation_guidance_box h4.pc{
    display: none;
}

.corporation_guidance_box h4 img{
    width: 18%;
}

.corporation_guidance_box h4 span{
    margin-left: 2%;
    width: 78%;
}

.corporation_guidance_content{
    display: block;
}

.corporation_guidance_content .img {
    width: auto;
}

.corporation_guidance_company {
    width: auto;
    padding-left: 0;
}

.corporation_guidance_box4 .corporation_guidance_company{
    margin-top: 20px;
}




.technology_5g {
    padding: 20px 0 40px;
}

.technology_5g h3{
    font-size: 22px;
}

.technology_5g_box{
    display: block;
    padding: 0 5%;
    margin-top: 40px;
}

.technology_5g_box .docomo {
    width: auto;
    padding-right: 0;
}

.technology_5g_box .docomo p {
    font-size: 16px;
    margin-top: 10px;
}

.technology_5g_classroom {
    width: auto;
    margin-top: 30px;
}

.technology_5g_classroom li .img {
    float: none;
    width: auto;
}

.technology_5g_classroom li .txt {
    float: none;
    width: auto;
    margin-top: 10px;
}

.technology_5g_feature {
    margin-top: 60px;
}

.technology_5g_feature h4{
    font-size: 22px;
}

.technology_5g_feature ul{
    display: block;
}

.technology_5g_feature li {
    width: auto;
    margin-right: 0;
    margin-bottom: 20px;
}

.technology_5g_feature_txt{
    font-size: 22px;
    margin-top: 20px;
}




.metaverse_box1{
    margin-top: 20px;
    padding: 0 5vw;
}

.metaverse_box1 .inner{
    margin-top: 20px;
    display: block;
}

.metaverse_box1 .inner .txt{
    font-size: 13px;
}

.metaverse_box1 .inner1{
    width: auto;
    padding-right: 0;
}

.metaverse_box1 .inner2{
    width: auto;
    padding-left: 0;
    margin-top: 20px;
}

.metaverse_box1 .inner2 .txt{
    left: 0;
}


.metaverse_box2{
    margin: 20px 0 40px;
    padding: 0 5vw;
}

.metaverse_box2 ul{
    margin-top: 20px;
}




.vtuber_special{
    margin-top: 20px;
    margin-bottom: 40px;
    padding: 0 5vw;
}

.vtuber_special h4{
    font-size: 22px;
    margin-bottom: 10px;
}

.vtuber_special .vtuber_special_read {
    font-size: 1.4rem;
}



.vtuber_special .box1 ul{
    display: block;
    margin-top: 20px;
}

.vtuber_special .box1 li.list1{
    width: 46%;
    float: left;
    /* margin-right: 4%; */
}

.vtuber_special .box1 li.list2{
    width: 50%;
    float: right;
}

.vtuber_special .box1 li.list3 {
    width: auto;
    clear: both;
    padding-top: 10px;
}

.vtuber_special .box2 {
    margin-top: 40px;
}

.vtuber_special .box2 ul{
    margin-top: 20px;
}

.vtuber_special .box2 li{
    width: 48%;
    margin-bottom: 4%;
}

.vtuber_special .box2 li:nth-child(2n){
    margin-right: 0;
}

.vtuber_special .box2 li h5{
    font-size: 1.5rem;
}

.vtuber_special .box3 {
    margin-top: 40px;
}

.vtuber_special .box3 .img {
    margin-top: 20px;
}

	.corporation_picup_block{
		padding:0 5vw;
	}

	.corporation_picup_block h4{
		padding: 5px 1em;
		font-size: 1.6rem;
		display: block;
	}

	.corporation_picup_block h4 img{
		width:140px;
	}

	.corporation_picup_block h4 strong{
		display:block;
		margin-left: 0;
	}

	.corporation_picup .box .inner .txt {
		margin-top: 10px;
	}

	.corporation_picup .box .inner .txt h5 {
		font-size: 17px;
		margin-bottom: 0;
	}

	.corporation_company_list{
		padding: 0 5vw;
	}

}



/* ================================================================
   #入試情報
================================================================ */
.mb-40 {
	margin-bottom:40px!important;
	margin-top:40px!important;
}
.mb-20 {
	margin-bottom:20px!important;
	margin-top:20px!important;
}
.exam-btn {
	color:#fff !important;
	text-decoration:none !important;
	margin:20px auto;
	font-weight:400 !important;
	font-size:1.5rem !important;
}
i.btn-pdf-icon {
	background-image: url(https://www.ncc-net.ac.jp/wp/wp-content/themes/ncc_2020_theme/common/img/icon_pdf-white.svg);
}
.pd-10 {
	padding:10px;
}
.indent-1 {
	padding-left:1em;
	text-indent:-1em;
}
ol.sub p,ol.sub li {
	font-size:95%;
}
h3.title {
	background-color:#ff6000;
	border-radius:2px;
	color:#fff;
	font-size:1.8rem;
	padding:.75em 1em;
	margin:0;
	border-top:none;
	border-bottom:none;
}
@media screen and (max-width:768px) {
	.exam-btn {
		margin:0 auto 15px ;
	}
	.mb-40 {
		margin:0 0 40px 0 !important;
	}
	.mb-20 {
		margin:0 0 20px 0 !important;
	}
}

/* ================================================================
   #先生紹介 写真を大きく
================================================================ */
.photo-box figure.teacher {
  padding-top: 100% !important;
}
.photo-box {
  background-color:rgba(255,255,255,0) !important;
}

/* ふきだしCSS */
.balloon1 {
  position: relative;
  display: inline-block;
  margin: 0 auto 1.0em;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
}

.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #e0edff;
}

.balloon1 p {
  margin: 0;
  padding: 0;
}

.balloon1-ai {
  background-color: rgba(197,133,255,0.2)
}

.balloon1-ai:before {
  border-top: 15px solid rgba(197,133,255,0.2);
}

.balloon1-sys {
  background-color: rgba(0,211,170,0.2)
}

.balloon1-sys:before {
  border-top: 15px solid rgba(0,211,170,0.2);
}

.balloon1-esports {
  background-color: rgba(255,96,0,0.2)
}

.balloon1-esports:before {
  border-top: 15px solid rgba(255,96,0,0.2);
}

.balloon1-game {
  background-color: rgba(238,118,173,0.2)
}

.balloon1-game:before {
  border-top: 15px solid rgba(238,118,173,0.2);
}

.balloon1-chara {
  background-color: rgba(0,160,64,0.2)
}

.balloon1-chara:before {
  border-top: 15px solid rgba(0,160,64,0.2);
}

.balloon1-cg {
  background-color: rgba(255,184,8,0.2)
}

.balloon1-cg:before {
  border-top: 15px solid rgba(255,184,8,0.2);
}

.balloon1-support {
  background-color: rgba(197, 133, 255,0.2)
}

.balloon1-support:before {
  border-top: 15px solid rgba(197, 133, 255,0.2);
}

/* ================================================================
   #トップページ 学校特長など
================================================================ */

@media screen and (max-width:768px) {
	section.new {
		margin:20px auto;
	}
	section.new div.top-course-content {
		position:relative;
		padding-top: 3vw;
		padding-bottom: 5vw;
	}
  .top-course-content .wf_btn-wrap .more-btn::before {
    content: "";
    border: rgba(0,0,0,.15) solid 1px;
  }
  .top-course-content2 {
	margin-bottom: 20px !important;
	padding-top: 3vw !important;
	padding-bottom: 3vw !important;
  }
}

/* ================================================================
   # 2022-10-05追加 ユーティリティクラス
================================================================ */
.mt0 { margin-top: 0 !important; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mr0 { margin-right: 0 !important; }
.mr10 { margin-right: 10px; }
.mr20 { margin-right: 20px; }
.mr30 { margin-right: 30px; }
.mr40 { margin-right: 40px; }
.mb0 { margin-bottom: 0 !important; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.ml0 { margin-left: 0 !important; }
.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }
.pt0 { padding-top: 0 !important; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pr0 { padding-right: 0 !important; }
.pr10 { padding-right: 10px; }
.pr20 { padding-right: 20px; }
.pr30 { padding-right: 30px; }
.pr40 { padding-right: 40px; }
.pb0 { padding-bottom: 0 !important; }
.pb10 { padding-bottom: 10px; }
.pb20 { padding-bottom: 20px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pl0 { padding-left: 0 !important; }
.pl10 { padding-left: 10px; }
.pl20 { padding-left: 20px; }
.pl30 { padding-left: 30px; }
.pl40 { padding-left: 40px; }

@media screen and (min-width:768px) {
  .mt0-sm { margin-top: 0 !important; }
  .mt10-sm { margin-top: 10px; }
  .mt20-sm { margin-top: 20px; }
  .mt30-sm { margin-top: 30px; }
  .mt40-sm { margin-top: 40px; }
  .mr0-sm { margin-right: 0 !important; }
  .mr10-sm { margin-right: 10px; }
  .mr20-sm { margin-right: 20px; }
  .mr30-sm { margin-right: 30px; }
  .mr40-sm { margin-right: 40px; }
  .mb0-sm { margin-bottom: 0 !important; }
  .mb10-sm { margin-bottom: 10px; }
  .mb20-sm { margin-bottom: 20px; }
  .mb30-sm { margin-bottom: 30px; }
  .mb40-sm { margin-bottom: 40px; }
  .ml0-sm { margin-left: 0 !important; }
  .ml10-sm { margin-left: 10px; }
  .ml20-sm { margin-left: 20px; }
  .ml30-sm { margin-left: 30px; }
  .ml40-sm { margin-left: 40px; }
  .pt0-sm { padding-top: 0 !important; }
  .pt10-sm { padding-top: 10px; }
  .pt20-sm { padding-top: 20px; }
  .pt30-sm { padding-top: 30px; }
  .pt40-sm { padding-top: 40px; }
  .pr0-sm { padding-right: 0 !important; }
  .pr10-sm { padding-right: 10px; }
  .pr20-sm { padding-right: 20px; }
  .pr30-sm { padding-right: 30px; }
  .pr40-sm { padding-right: 40px; }
  .pb0-sm { padding-bottom: 0 !important; }
  .pb10-sm { padding-bottom: 10px; }
  .pb20-sm { padding-bottom: 20px; }
  .pb30-sm { padding-bottom: 30px; }
  .pb40-sm { padding-bottom: 40px; }
  .pl0-sm { padding-left: 0 !important; }
  .pl10-sm { padding-left: 10px; }
  .pl20-sm { padding-left: 20px; }
  .pl30-sm { padding-left: 30px; }
  .pl40-sm { padding-left: 40px; }
}

@media screen and (min-width:1024px) {
  .mt0-md { margin-top: 0 !important; }
  .mt10-md { margin-top: 10px; }
  .mt20-md { margin-top: 20px; }
  .mt30-md { margin-top: 30px; }
  .mt40-md { margin-top: 40px; }
  .mr0-md { margin-right: 0 !important; }
  .mr10-md { margin-right: 10px; }
  .mr20-md { margin-right: 20px; }
  .mr30-md { margin-right: 30px; }
  .mr40-md { margin-right: 40px; }
  .mb0-md { margin-bottom: 0 !important; }
  .mb10-md { margin-bottom: 10px; }
  .mb20-md { margin-bottom: 20px; }
  .mb30-md { margin-bottom: 30px; }
  .mb40-md { margin-bottom: 40px; }
  .ml0-md { margin-left: 0 !important; }
  .ml10-md { margin-left: 10px; }
  .ml20-md { margin-left: 20px; }
  .ml30-md { margin-left: 30px; }
  .ml40-md { margin-left: 40px; }
  .pt0-md { padding-top: 0 !important; }
  .pt10-md { padding-top: 10px; }
  .pt20-md { padding-top: 20px; }
  .pt30-md { padding-top: 30px; }
  .pt40-md { padding-top: 40px; }
  .pr0-md { padding-right: 0 !important; }
  .pr10-md { padding-right: 10px; }
  .pr20-md { padding-right: 20px; }
  .pr30-md { padding-right: 30px; }
  .pr40-md { padding-right: 40px; }
  .pb0-md { padding-bottom: 0 !important; }
  .pb10-md { padding-bottom: 10px; }
  .pb20-md { padding-bottom: 20px; }
  .pb30-md { padding-bottom: 30px; }
  .pb40-md { padding-bottom: 40px; }
  .pl0-md { padding-left: 0 !important; }
  .pl10-md { padding-left: 10px; }
  .pl20-md { padding-left: 20px; }
  .pl30-md { padding-left: 30px; }
  .pl40-md { padding-left: 40px; }
}

@media screen and (min-width:1366px) {
  .mt0-lg { margin-top: 0 !important; }
  .mt10-lg { margin-top: 10px; }
  .mt20-lg { margin-top: 20px; }
  .mt30-lg { margin-top: 30px; }
  .mt40-lg { margin-top: 40px; }
  .mr0-lg { margin-rught: 0 !important; }
  .mr10-lg { margin-rught: 10px; }
  .mr20-lg { margin-rught: 20px; }
  .mr30-lg { margin-rught: 30px; }
  .mr40-lg { margin-rught: 40px; }
  .mb0-lg { margin-bottom: 0 !important; }
  .mb10-lg { margin-bottom: 10px; }
  .mb20-lg { margin-bottom: 20px; }
  .mb30-lg { margin-bottom: 30px; }
  .mb40-lg { margin-bottom: 40px; }
  .ml0-lg { margin-left: 0 !important; }
  .ml10-lg { margin-left: 10px; }
  .ml20-lg { margin-left: 20px; }
  .ml30-lg { margin-left: 30px; }
  .ml40-lg { margin-left: 40px; }
  .pt0-lg { padding-top: 0 !important; }
  .pt10-lg { padding-top: 10px; }
  .pt20-lg { padding-top: 20px; }
  .pt30-lg { padding-top: 30px; }
  .pt40-lg { padding-top: 40px; }
  .pr0-lg { padding-rught: 0 !important; }
  .pr10-lg { padding-rught: 10px; }
  .pr20-lg { padding-rught: 20px; }
  .pr30-lg { padding-rught: 30px; }
  .pr40-lg { padding-rught: 40px; }
  .pb0-lg { padding-bottom: 0 !important; }
  .pb10-lg { padding-bottom: 10px; }
  .pb20-lg { padding-bottom: 20px; }
  .pb30-lg { padding-bottom: 30px; }
  .pb40-lg { padding-bottom: 40px; }
  .pl0-lg { padding-left: 0 !important; }
  .pl10-lg { padding-left: 10px; }
  .pl20-lg { padding-left: 20px; }
  .pl30-lg { padding-left: 30px; }
  .pl40-lg { padding-left: 40px; }
}

@media (hover: hover) {
  .hover-op1:hover { opacity: 0.1; transition: all .2s linear; }
  .hover-op2:hover { opacity: 0.2; transition: all .2s linear; }
  .hover-op3:hover { opacity: 0.3; transition: all .2s linear; }
  .hover-op4:hover { opacity: 0.4; transition: all .2s linear; }
  .hover-op5:hover { opacity: 0.5; transition: all .2s linear; }
  .hover-op6:hover { opacity: 0.6; transition: all .2s linear; }
  .hover-op7:hover { opacity: 0.7; transition: all .2s linear; }
  .hover-op8:hover { opacity: 0.8; transition: all .2s linear; }
  .hover-op9:hover { opacity: 0.9; transition: all .2s linear; }
}

.temporary-banner {
  margin-top: 2em;
}
.temporary-banner img {
  width: 100%;
}

.temporary-banner-page {
  max-width: 1080px;
  margin: auto;
}

@media screen and (max-width:1079px) {
  .temporary-banner-page {
    width: calc(100% - 10vw);
  }
}