@charset "utf-8"; /* ----------------- Layout --------------------- */ section{margin: 0; padding: 3rem 0; position: relative;} section h2{color: #000; font-size: 1.85rem; font-weight: 700; line-height: 1.25em; letter-spacing: 2px; text-align: center;} section h2 span {display: block; font-size: 0.8rem; font-weight: 400; text-transform: uppercase; color: #b81d21; letter-spacing: 7px;} .flex{display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;} .align-center {text-align: center;} .wrapper{width: 100%; max-width: 1240px; margin: 0 auto; padding: 0; position: relative;} section#terms .inner, section#contact .inner, section#about.management .inner{width: 80%; margin: 0 auto;} .inner{width: 100%; padding: 3rem;} /*tablet*/ @media (max-width: 1024px) { section{padding: 1.25rem 0;} section h2{font-size: 1.35rem;} section h2 span {font-size: 0.55rem; letter-spacing: 5px;} .flex{flex-direction: column;} section#terms .inner, section#contact .inner, section#about.management .inner{width: 100%;} .inner{padding: 1.25rem;} } /*smart phone*/ @media (max-width: 430px) { } /*========= main =========*/ /*=== Section - main-info ===*/ section#main-info{width: 100%; background: #423b3b; padding: 3rem 0; overflow: hidden;} section#main-info ul.slick-info a{transition: 0.3s ease-in-out;} section#main-info ul.slick-info a:hover figure, section#main-info ul.slick-info a:focus figure{opacity: 0.8; transition: 0.3s all linear;} section#main-info ul.slick-info a:hover div.info__txt, section#main-info ul.slick-info a:focus div.info__txt{color: #b81c22; transition: 0.3s all linear;} section#main-info dl > dt{border-radius: 20px; overflow: hidden;} section#main-info dl > dt figure{display: block; width: 100%; height: auto;} section#main-info dl > dt figure img{width: 100%; height: 100%; max-width: 640px;} section#main-info dl > dd{text-align: center; padding: 0.5rem;} section#main-info dl > dd div.info__txt{color: #fff; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2;} section#main-info .swiper-pagination{bottom: var(--swiper-pagination-bottom, 20px);} section#main-info .swiper-pagination .swiper-pagination-bullet-active {background: #b81c22 !important;} section#main-info .swiper-pagination .swiper-pagination-bullet { width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 10px)); height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 10px)); opacity: var(--swiper-pagination-bullet-inactive-opacity, 1); background: rgb(255, 255, 255);} /*tablet*/ @media (max-width: 1024px) { section#main-info {padding: 2.5rem 0;} section#main-info dl > dt{border-radius: 10px;} section#main-info dl > dd{padding: 0.25rem;} section#main-info dl > dd div.info__txt{font-size: 0.85rem; padding: 0.25rem;} } /*smart phone*/ @media (max-width: 430px) { } /*========= Area =========*/ section#area{} section#area .inner .col{width: 33.333%; padding: 1%;} section#area .inner .col a{color: #333;} section#area .inner .col .detail {color: initial;} section#area .inner .col a:hover .area-img{opacity: 0.85; transition: 0.3s all linear;} section#area .detail .area-img{padding: 0.75rem 0;} section#area .detail .area-info .area-title{display: block; margin-bottom: 0.5rem; font-size: 1.15rem; font-weight: 700;} section#area .detail .area-info .area-desc{font-size: 0.945rem; letter-spacing: 1px;} /*tablet*/ @media (max-width: 1024px) { section#area .inner .col{width: 100%; max-width: 420px; padding: 0; margin: 0 auto;} section#area .detail .area-info .area-title{margin-bottom: 0.25rem; font-size: 1.0rem;} section#area .detail .area-info .area-desc{display: inline-block; font-size: 0.8rem; line-height: 1.5em;} } /*smart phone*/ @media (max-width: 430px) { section#area .inner .col{max-width: 300px;} } /*========= Application =========*/ section#app{} section#app ul.flex{justify-content: space-evenly;} section#app ul > li{width: 100%; max-width: 250px; margin: 1.5rem 0;} section#app .detail a{color: #000;} section#app .detail a:hover .app-img{border: 2px solid #b81c22; background: #b81c22; transition: 0.3s all linear;} section#app .detail .app-img{border: 2px solid #b81c22; background: #fff; border-radius: 15px; padding: 50% 0; line-height: 0; position: relative; text-indent: 100%; overflow: hidden; white-space: nowrap;} section#app .detail .app-img.app-guest:before, section#app .detail .app-img.app-add:before, section#app .detail .app-img.app-date:before, section#app .detail .app-img.app-contact:before{content: ''; display: block; position: absolute; top: 50%; left: 50%; background-repeat: no-repeat;} section#app .detail .app-img.app-guest:before{ background-image: url(../img/general/app__guest_def.svg); width: 180px; height: 180px; margin: -80px 0 0 -70px;} section#app .detail .app-img.app-add:before{ background-image: url("../img/general/app__add_def.svg"); width: 170px; height: 170px; margin: -80px 0 0 -80px;} section#app .detail .app-img.app-date:before{ background-image: url("../img/general/app__date_def.svg"); width: 170px; height: 170px; margin: -75px 0 0 -75px;} section#app .detail .app-img.app-contact:before{ background-image: url("../img/general/app__contact_def.svg"); width: 150px; height: 150px; margin: -75px 0 0 -60px;} section#app .detail a:hover .app-img.app-guest:before{background-image: url(../img/general/app__guest_ena.svg); transition: 0.3s all linear;} section#app .detail a:hover .app-img.app-add:before{background-image: url("../img/general/app__add_ena.svg"); transition: 0.3s all linear;} section#app .detail a:hover .app-img.app-date:before{background-image: url("../img/general/app__date_ena.svg"); transition: 0.3s all linear;} section#app .detail a:hover .app-img.app-contact:before{background-image: url("../img/general/app__contact_ena.svg"); transition: 0.3s all linear;} section#app .detail .app-info{display: inline-block; padding: 0.75rem 0 0;} section#app .detail span .app-title{display: block; font-size: 1.15rem; font-weight: 600; text-align: center; margin-bottom: 0.5rem;} section#app .detail span .app-desc{display: block; font-size: 0.8rem; letter-spacing: 1px;} /*tablet*/ @media (max-width: 1024px) { section#app ul.flex{padding: 1.25rem; flex-direction: row; justify-content: space-around;} section#app ul > li{width: 23%; max-width: none; margin: 1%;} section#app .detail .app-img.app-guest:before{width: 80%; height: 80%; margin: -35% 0 0 -35%;} section#app .detail .app-img.app-add:before{width: 80%; height: 80%; margin: -39% 0 0 -35%;} section#app .detail .app-img.app-date:before{width: 80%; height: 80%; margin: -39% 0 0 -39%;} section#app .detail .app-img.app-contact:before{width: 80%; height: 80%; margin: -40% 0 0 -35%;} section#app .detail .app-info{width: 100%; text-align: center; padding: 0.375rem 0 0;} section#app .detail span .app-title{font-size: 0.8rem; margin-bottom: 0;} section#app .detail span .app-desc{display: none;} } /*smart phone*/ @media (max-width: 430px) { section#app .detail span .app-title {font-size: 0.55rem;} } /*========= News =========*/ section#news {} section#news .categories {position: relative; overflow: hidden; height: 60px; margin: 1rem 0;} section#news .categories .js-news-navi-inner {display: block; width: 100%; overflow-x: scroll; padding-bottom: 17px; -webkit-overflow-scrolling: touch;} section#news .categories button.js-news-navi-arrow {display: none; width: 20px; height: 100%; background-color: rgba(0, 0, 0, 0.5); position: absolute; top: 0; cursor: pointer; z-index: 1;} section#news .categories .js-news-navi-arrow-prev {left: 0;} section#news .categories .js-news-navi-arrow-prev:before {content: ''; width: 10px; height: 10px; border: 0; border-top: solid 2px #fff; border-right: solid 2px #fff; transform: rotate(225deg); position: absolute; top: 0; left: 7px; bottom: 0; margin: auto;} section#news .categories .js-news-navi-arrow-next {right: 0;} section#news .categories .js-news-navi-arrow-next:before {content: ''; width: 10px; height: 10px; border: 0; border-top: solid 2px #fff; border-right: solid 2px #fff; transform: rotate(45deg); position: absolute; top: 0; right: 7px; bottom: 0; margin: auto;} section#news .categories ul.news__lists {display: flex; flex-wrap: nowrap; white-space: nowrap;} section#news .categories ul.news__lists > li {flex: 1 0 195px; display: inline-block;} section#news .categories ul.news__lists > li a {display: block; background-color: #fff; color: #b81d21; font-size: 1.2rem; font-weight: bold; text-align: center; padding: 0 5px; position: relative; transition: 0.3s all linear; line-height: 58px; border: 1px solid #b81d21;} section#news .categories ul.news__lists > li a.active:hover{color: #fff !important;} section#news .categories ul.news__lists > li a.active {background-color: #b81d21; color: #fff;} section#news .categories ul.news__lists > li a:not(.active):after {content: ''; position: absolute; bottom: 0; left: 0; width: 12px; height: 100%; background: #b81d21; color: #fff; transform: scale(0, 1); transform-origin: left top; transition: transform 0.3s;} section#news .categories ul.news__lists > li a[data-id="cat_kanto"]:not(.active):after {background-color: #b81d21;} section#news .categories ul.news__lists > li a[data-id="cat_tokai"]:not(.active):after {background-color: #b81d21;} section#news .categories ul.news__lists > li a[data-id="cat_online"]:not(.active):after {background-color: #1bb3ae;} section#news .categories ul.news__lists > li a[data-id="cat_game"]:not(.active):after {background-color: #f14408;} section#news .categories ul.news__lists > li a[data-id="cat_campaign"]:not(.active):after {background-color: #b2ad82;} section#news .categories ul.news__lists > li a[data-id="cat_other"]:not(.active):after {background-color: #999999;} section#news .categories ul.news__lists > li a:not(.active):hover::after {transform: scale(1, 1); -webkit-transform: scale(1, 1);} section#news .categories ul.news__lists > li:not(:first-child) {margin-left: 10px;} section#news .category__posts .tgt-fade {display: none; opacity: 0; -webkit-transition: all .2s; transition: all .2s;} section#news .category__posts .tgt-fade.active {display: block; opacity: 1; -webkit-animation: fadeIn .5s; animation: fadeIn .5s;} section#news .category__posts .tgt-fade.hidden {display: block; opacity: 0;} section#news .category__posts{margin-bottom: 2rem;} section#news .category__posts .posts ul.news-list > li{width: 31%; min-height: 525px; background: #fff; margin: 1%; overflow: hidden;} section#news .category__posts .posts ul.news-list > li figure{display: block; width: 100%; height: auto;} section#news .category__posts .posts ul.news-list > li figure img{width: 100%; height: 100%; max-width: 640px;} section#news .category__posts .posts dd{padding: 1rem;} section#news .category__posts .posts dd .news-data{align-items: center;} section#news .category__posts .posts dd .news-data time{color: #000; font-size: 0.85rem; margin-right: 5px;} section#news .category__posts .posts dd .news-data object .term-categories{display: inline-block; background-color: #333; color: #fff; font-size: 0.65rem; line-height: 1; padding: 4px 8px 5px; letter-spacing: 1px; vertical-align: 2px; margin: 0 0.1rem;} section#news .category__posts .posts dd .news-data object .term-categories.cat_kanto{background-color: #b81c22;} section#news .category__posts .posts dd .news-data object .term-categories.cat_online{background-color: #1bb3ae;} section#news .category__posts .posts dd .news-data object .term-categories.cat_tokai{background-color: #b81c22;} section#news .category__posts .posts dd .news-data object .term-categories.cat_game{background-color: #f14408;} section#news .category__posts .posts dd .news-data object .term-categories.cat_campaign{background-color: #b2ad82;} section#news .category__posts .posts dd .news-data object .term-categories.cat_other{background-color: #999999;} section#news .category__posts .posts dd .news-title{font-size: 0.95rem; padding: 0.25rem 0;} section#news .category__posts .posts a .news-title {color: #000;} section#news .category__posts .posts a:hover .news-title {color: #b81c22;} section#news .btnArea{max-width: 280px; margin: 0 auto;} section#news .btnArea a{width: 100%; background: #fff; color: #333; border: 1px solid #333; display: flex; align-items: center; justify-content: center; padding: 0.8rem; flex-direction: column; text-align: center; position: relative;} section#news .btnArea a:hover{border: 1px solid #b81c22;} section#news .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#news .btnArea a:hover:after{border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} section#news .newsDetail{width: 100%; margin-bottom: 3rem;} section#news .newsDetail time{color: #b81c22; font-size: 0.9rem; font-weight: 700;} section#news .newsDetail h3.news-title{font-size: 2.0rem; line-height: 1.25em; padding: 1.0rem 0;} section#news .newsDetail object .term-categories{display: inline-block; background-color: #333; color: #fff; font-size: 0.75rem; line-height: 1; padding: 10px 15px; letter-spacing: 1px; vertical-align: 2px; margin: 0 0.1rem;} section#news .newsDetail object .term-categories.cat_kanto{background-color: #b81c22;} section#news .newsDetail object .term-categories.cat_online{background-color: #1bb3ae;} section#news .newsDetail object .term-categories.cat_tokai{background-color: #b81c22;} section#news .newsDetail object .term-categories.cat_game{background-color: #f14408;} section#news .newsDetail object .term-categories.cat_campaign{background-color: #b2ad82;} section#news .newsDetail object .term-categories.cat_other{background-color: #999999;} section#news .newsDetail figure{display: block; text-align: center;} section#news .newsDetail figure img{width: 100%; max-width: 500px; height: auto;} section#news .newsDetail .news-text h4{font-size: 2rem; line-height: 1em; font-weight: 700; position: relative;} section#news .newsDetail .news-text h4:before{content: ''; display: block; width: 15%; height: 2px; background-color: #b81d21; position: absolute; bottom: -15px; left: 0; margin: auto 0; z-index: 1;} section#news .newsDetail .news-text h4:after{content: ''; display: block; width: 100%; height: 2px; background-color: #c5c5c5; position: absolute; bottom: -15px; left: 0; margin: auto 0;} section#news .newsDetail .news-text h5{font-size: 1.6rem; line-height: 1em; line-height: 1.4em; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem; position: relative;} section#news .newsDetail .news-text h5:before{content: ''; display: block; background: #b81d21; width: 4px; height: 80%; position: absolute; top: 5px; left: 0;} section#news .newsDetail .news-text p{line-height: 2.0em;} section#news .newsDetail .news-text hr{display: block; background: #ccc; width: 100%; height: 1px; line-height: 0; margin: 3rem 0; border: 0;} section#news .newsDetail .news-text a{color: #333; text-decoration: underline;} section#news .newsDetail .news-text a.arrow{display: inline-block; padding: 0 0 0 1rem; position: relative;} section#news .newsDetail .news-text a.arrow::before {content: ''; width: 8px; height: 8px; border-top: solid 3px #b81d21; border-right: solid 3px #b81d21; position: absolute; left: 3px; top: 10px; transform: rotate(45deg);} section#news .newsDetail .news-text .btnArea a{text-decoration: none;} section#news .newsDetail .news-text ul.images > li{width: 100%; margin: 1%;} section#news .newsDetail .news-text ul.images > li.col-12{width: 100%;} section#news .newsDetail .news-text ul.images > li.col-6{width: 48%;} section#news .newsDetail .news-text ul.images > li.col-3{width: 31.333%;} section#news .newsDetail .news-text ul.btns{width: 90%; max-width: 680px; margin: 0 auto} section#news .newsDetail .news-text ul.btns > li{width: 100%; margin: 1%;} section#news .newsDetail .news-text ul.btns > li.col-12{width: 100%;} section#news .newsDetail .news-text ul.btns > li.col-6{width: 48%;} section#news .newsDetail .news-text ul.btns > li.col-4{width: 31.333%;} section#news .newsDetail .news-text .tablebox{overflow-x: scroll;} section#news .newsDetail .news-text table{border-collapse:collapse;} section#news .newsDetail .news-text table th{white-space: nowrap;} section#news .newsDetail .news-text table td{border: solid 1px #ddd; white-space: nowrap;} section#news .newsDetail .news-text table th{font-weight: 600; line-height: 1.4; padding: 1.0rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#news .newsDetail .news-text table td{vertical-align: middle; padding: 1rem;} section#news .newsDetail .news-text .news-movie {width: 100%; position: relative; padding-top: 56.25%;} section#news .newsDetail .news-text .news-movie iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 3%; background: #423b3b;} section#news .pager{display: flex; justify-content: center; align-items: flex-start;} section#news .pager .page-numbers{font-size: 1.225rem; font-weight: 700; line-height: 1; margin: 0.5rem 0.75rem;} section#news .pager span.current{display: inline-block; color: #b81c22; position: relative;} section#news .pager span.current:after{content: ''; display: block; position: absolute; bottom: -7px; background: #b81c22; width: 110%; height: 3px;} section#news .pager .page-numbers.next, section#news .pager .page-numbers.prev{color: #b81c22;} section#news .pager .prev_next_list li.next, section#news .pager .prev_next_list li.prev{font-size: 1.225rem; font-weight: 700; line-height: 1; margin: 0.5rem 0.75rem; position: relative;} section#news .pager .prev_next_list li.next a .ttl:before{content: '<'; display: inline-block; color: #b81c22; margin: 0 3px;} section#news .pager .prev_next_list li.prev a .ttl:after{content: '>'; display: inline-block; color: #b81c22; margin: 0 3px;} section#news .pager a.page-numbers, section#news .pager .prev_next_list a{color: #ccc;} /*tablet*/ @media (max-width: 1024px) { section#news .categories {height: 50px; margin: 0 0 1rem;} section#news .categories ul.news__lists > li {flex: 1 0 99px;} section#news .categories ul.news__lists > li a {font-size: 0.9rem; line-height: 48px;} section#news .categories ul.news__lists > li:not(:first-child) {margin-left: 5px;} section#news .category__posts .posts ul.news-list > li{width: 100%; min-height: auto; margin: 0 0 1.0rem;} section#news .category__posts .posts dl{display: flex; justify-content: flex-start; align-items: center;} section#news .category__posts .posts dt{width: 30%;} section#news .category__posts .posts dd{width: 70%; padding: 0.5rem;} section#news .category__posts .posts dd .news-data {flex-direction: row;} section#news .category__posts .posts dd .news-data time{font-size: 1.0rem; margin-right: 10px;} section#news .category__posts .posts dd .news-title{font-size: 1.0rem; padding: 0.25rem 0;} section#news .newsDetail{margin-bottom: 2rem;} section#news .newsDetail h3.news-title{font-size: 1.6rem;} section#news .newsDetail object .term-categories{font-size: 0.6rem; padding: 8px 10px; margin: 0.1rem;} section#news .newsDetail .news-text h4{font-size: 1.4rem; line-height: 1.4em;} section#news .newsDetail .news-text h5{font-size: 1.4rem;} section#news .newsDetail .news-text hr{margin: 2rem 0;} section#news .newsDetail .news-text ul.images > li.col-12, section#news .newsDetail .news-text ul.images > li.col-6, section#news .newsDetail .news-text ul.images > li.col-3{width: 100%; max-width: 620px; margin: 1% auto;} section#news .newsDetail .news-text ul.btns > li{width: 100%; margin: 1%;} section#news .newsDetail .news-text ul.btns > li.col-12, section#news .newsDetail .news-text ul.btns > li.col-6, section#news .newsDetail .news-text ul.btns > li.col-4{width: 100%; max-width: 620px; margin: 1% auto;} } /*smart phone*/ @media (max-width: 430px) {} /*========= GameInfo =========*/ section#gameInfo{} section#gameInfo .area-info .area-inner{justify-content: space-between; margin: 1rem 0 0;} section#gameInfo .area-info .area-inner .blk_label:hover{transition: 0.3s all linear;} section#gameInfo .area-info .area-inner .blk_label {width: 33%; display: inline-block; border: 1px solid #b81d21; color: #b81d21; text-align: center; padding: 1rem; font-size: 1.2rem; line-height: 1; font-weight: 600; cursor: pointer;} section#gameInfo .area-info .area-inner input[name="tab_blk-switch"] {display: none;} section#gameInfo .area-info .area-inner input:checked + .blk_label {background-color: #b81d21; color: #fff;} #tab__blk-01:checked ~ #tab__blk-01_data, #tab__blk-02:checked ~ #tab__blk-02_data, #tab__blk-03:checked ~ #tab__blk-03_data {display: block; opacity: 1; animation: fadeIn .5s;} section#gameInfo .area-info .area__blk{display: none; margin-top: 1rem; opacity: 0; overflow: hidden; transition: all .2s;} section#gameInfo .area-info .area__blk h3{width: 100%; color: #fff; font-size: 1.25rem; font-weight: 500; line-height: 1; text-align: center; background-color: #423b3b; padding: 1rem;} section#gameInfo .area-info .area__blk .area__blk-List p.none{color: #b81d21; text-align: center; margin: 2.5rem 0;} section#gameInfo .area-info .area__blk .area__blk-List ul{margin: 1rem 0;} section#gameInfo .area-info .area__blk .area__blk-List ul > li{min-width: 15.5%; margin: 0.5%;} section#gameInfo .area-info .area__blk .area__blk-List ul > li a{display: inline-block; width: 100%; color: #b81d21; font-size: 1.0rem; border: 1px solid #b81d21; text-align: center; padding: 0.5rem;} section#gameInfo .area-info .area__blk .area__blk-List ul > li a:hover{background-color: #b81d21; color: #fff !important; transition: 0.3s all linear;} /*tablet*/ @media (max-width: 1024px) { section#gameInfo .area-info .area-inner .blk_label {width: 32.433%; padding: 0.75rem 0.2rem; font-size: 0.8rem;} section#gameInfo .area-info .area__blk{margin-top: 1.25rem;} section#gameInfo .area-info .area__blk h3{font-size: 1.0rem; padding: 0.75rem;} section#gameInfo .area-info .area__blk .area__blk-List p.none{margin: 2.0rem 0;} section#gameInfo .area-info .area__blk .area__blk-List ul{flex-direction: row; margin: 1.25rem 0;} section#gameInfo .area-info .area__blk .area__blk-List ul > li{min-width: 23%; margin: 1.0%;} section#gameInfo .area-info .area__blk .area__blk-List ul > li a{font-size: 0.8rem;} } /*smart phone*/ @media (max-width: 430px) { section#gameInfo .area-info .area-inner .blk_label {width: 32.233%; font-size: 0.725rem;} section#gameInfo .area-info .area__blk .area__blk-List p.none{font-size: 0.8rem;} section#gameInfo .area-info .area__blk .area__blk-List ul > li{min-width: 31.333%;} section#gameInfo .area-info .area__blk .area__blk-List ul > li a{font-size: 0.75rem;} } /*========= PickUp =========*/ section#pickup{} section#pickup .pickup__card a:hover{opacity: 0.85;} section#pickup .pickup__card a.first-card{display: block; width: 98.533%; margin: 2.0rem auto 1.25rem; overflow: hidden;} section#pickup .first-card-item{display: flex; justify-content: center; align-items: center; border-radius: 15px; background-image: url(../img/general/one__pickup_large.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; padding: 5rem;} section#pickup .first-card-item .begin-text .inner-begin, section#pickup .first-card-item .begin-text .inner-s-final{display: flex; align-items: center; flex-direction: column;} section#pickup .first-card-item .begin-text .inner-begin img, section#pickup .first-card-item .begin-text .inner-s-final img{width: 100%; max-width: 64px;} section#pickup .first-card-item .begin-text span.sub-text{color: #fff; font-size: 1.4rem; font-weight: 300; letter-spacing: 2px; margin: 0.45rem 0 0;} section#pickup .first-card-item .begin-text span.reco_sub{font-size: 1.4rem; font-weight: 300; letter-spacing: 2px; margin: 0.45rem 0 0;} section#pickup .first-card-item .begin-text div.main-text{width: 100%; margin: 1.2rem 0;} section#pickup .first-card-item .begin-text div.main-text img{width: 100%; max-width: 260px;} section#pickup .first-card-item .begin-text .begin-btn{font-size: 1.25rem; line-height: 1; color: #fff; border: 1px solid #fff; border-radius: 30px; padding: 0.65rem; width: 250px; text-align: center;} section#pickup .pickup__card-list .pickup__card-item{width: 31.833%; margin: 0.75%; overflow: hidden;} section#pickup .pickup__card-list .pickup__card-item a img{border-radius: 15px;} section#pickup .pickup__card-list .pickup__card-item span.topic-title{display: block; color: #fff; font-size: 1rem; padding: 0.5rem 0;} /*tablet*/ @media (max-width: 1024px) { section#pickup .pickup__card a.first-card{width: 90%; margin: 1.25rem auto;} section#pickup .first-card-item{padding: 2.5rem;} section#pickup .first-card-item .begin-text .inner-begin img, section#pickup .first-card-item .begin-text .inner-s-final img{max-width: 48px;} section#pickup .first-card-item .begin-text span.sub-text{font-size: 1.15rem; margin: 0.5rem 0 0;} section#pickup .first-card-item .begin-text span.reco_sub{font-size: 1.15rem; margin: 0.5rem 0 0;} section#pickup .first-card-item .begin-text div.main-text{margin: 0.65rem 0 1.0rem;} section#pickup .first-card-item .begin-text div.main-text img{max-width: 160px;} section#pickup .first-card-item .begin-text .begin-btn{font-size: 0.9rem; padding: 0.55rem; width: 140px;} section#pickup .pickup__card-list.flex{width: 90%; flex-direction: row; justify-content: space-between; margin: 0 auto;} section#pickup .pickup__card-list .pickup__card-item{width: 31.3333%; margin: 0;} section#pickup .pickup__card-list .pickup__card-item span.topic-title{font-size: 0.7rem; padding: 0.25rem 0;} } /*smart phone*/ @media (max-width: 430px) { section#pickup .pickup__card-list .pickup__card-item{width: 47.5%;} section#pickup .pickup__card-list .pickup__card-item span.topic-title{font-size: 0.7rem;} } /*========= Support =========*/ section#support{} section#support .inner .col{width: 50%; padding: 1%;} section#support .inner .row{width: 100%; padding: 1%;} section#support .inner .row a, section#support .inner .col a{color: #b81c22;} section#support .inner .row a:hover .contact__Box, section#support .inner .col a:hover .contact__Box{background: #b81c22; color: #fff; transition: 0.3s all linear;} section#support .inner .row a:hover .contact__Box:after, section#support .inner .col a:hover .contact__Box:after{border-top: solid 3px #fff; border-right: solid 3px #fff; transition: 0.3s all linear;} section#support .inner .row a:hover .contact__Box p, section#support .inner .col a:hover .contact__Box p{color: #fff; transition: 0.3s all linear;} section#support .inner .row a:hover p.group, section#support .inner .col a:hover p.group{color: #b81c22; transition: 0.3s all linear;} section#support .inner .row p.group, section#support .inner .col p.group {font-size: 1.0rem; color: initial; padding: 0.25rem 0 0;} section#support .inner .row .contact__Box, section#support .inner .col .contact__Box{width: 100%; height: 160px; background: #fff; border: 1px solid #b81c22; display: flex; align-items: center; justify-content: center; padding: 1.5rem 4rem 1.5rem 1.5rem; flex-direction: column; text-align: center; position: relative;} section#support .inner .row .contact__Box:after, section#support .inner .col .contact__Box:after{content: ''; width: 25px; height: 25px; border: 0; border-top: solid 3px #b81c22; border-right: solid 3px #ae1f1f; transform: rotate(45deg); position: absolute; top: 0; right: 30px; bottom: 0; margin: auto;} section#support .inner .row .contact__Box h3, section#support .inner .col .contact__Box h3{width: 100%; font-size: 1.4rem; font-weight: 700; line-height: 1.35em; margin-bottom: 0.5rem;} section#support .inner .row .contact__Box p, section#support .inner .col .contact__Box p{font-size: 0.85rem; line-height: 1.4em; color: initial;} section#support .inner .row .contact__Box p span, section#support .inner .col .contact__Box p span{display: block; font-size: 0.55rem;} /*tablet*/ @media (max-width: 1024px) { section#support .inner .col, section#support .inner .row{width: 100%; max-width: 500px; margin: 0 auto;} section#support .inner .row p.group, section#support .inner .col p.group {font-size: 0.75rem;} section#support .inner .row .contact__Box, section#support .inner .col .contact__Box{height: auto; padding: 1rem 3rem 1rem 1rem;} section#support .inner .row .contact__Box:after, section#support .inner .col .contact__Box:after{content: ''; width: 20px; height: 20px; right: 25px;} section#support .inner .row .contact__Box h3, section#support .inner .col .contact__Box h3{font-size: 1.2rem; line-height: 1.25em; margin-bottom: 0.25rem;} section#support .inner .row .contact__Box p, section#support .inner .col .contact__Box p{font-size: 0.8rem;} } /*smart phone*/ @media (max-width: 430px) { section#support .inner .row .contact__Box:after, section#support .inner .col .contact__Box:after{content: ''; width: 18px; height: 18px; right: 20px;} section#support .inner .row .contact__Box h3, section#support .inner .col .contact__Box h3{font-size: 0.9rem; line-height: 1.4em;} } /* ----------------- Contents Layout --------------------- */ /*========= Ranking =========*/ section#ranking{} section#ranking .content__Box{margin: 1.5rem 0 3rem;} section#ranking .content__Box:last-of-type{margin: 1.5rem 0 0;} section#ranking .content__Box h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#ranking .content__Box h3:before{content: ''; display: block; background: #b81d21;; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#ranking .content__Box p{line-height: 1.85em; letter-spacing: 1px;} section#ranking .content__Box.gf-entry{} section#ranking .content__Box.gf-entry .list ul{width: 100%; display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap;} section#ranking .content__Box.gf-entry .list ul > li{width: 49.5%; padding: 0.75rem; margin: 0.25%; background: #efefef;} section#ranking .content__Box.gf-entry .list ul > li .rank-main{width: 100%; display: flex; justify-content: flex-start; align-items: center;} .rank-main .team-status{width: 32px; text-align: center;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-status{width: 55px; text-align: center;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-logo{padding: 0 1rem;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-logo .team-image{width: 80px; height: 80px; clip-path: circle(40px at 50% 50%); position: relative;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-logo .team-image img{width: 100%; height: 100%; object-fit: cover;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-info .team-name{font-size: 1.5rem;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-info .shop-name{font-size: 0.6rem; font-weight: 700; color: #999;} section#ranking .content__Box.ranking date{display: block; text-align: right; margin: -3rem 0 1.5rem; font-size: 0.8rem;} section#ranking .content__Box.ranking .detail .tablebox{width: 100%; overflow-x: scroll;} section#ranking .content__Box.ranking .detail table{width: 100%; border-collapse: collapse;} section#ranking .content__Box.ranking .detail table th{white-space: nowrap;} section#ranking .content__Box.ranking .detail table td{border: solid 1px #ddd; white-space: nowrap;} section#ranking .content__Box.ranking .detail .tablepress>:where(thead,tfoot)>*>th {color: #fff; font-size: 1.0rem; font-weight: 500; line-height: 1; text-align: center; background-color: #423b3b; padding: 1rem;} section#ranking .content__Box.ranking .detail .tablepress td.column-1, section#ranking .content__Box.ranking .detail .tablepress td.column-4, section#ranking .content__Box.ranking .detail .tablepress td.column-5, section#ranking .content__Box.ranking .detail .tablepress td.column-6, section#ranking .content__Box.ranking .detail .tablepress td.column-7{text-align: center;} section#ranking .content__Box.ranking .detail .tablepress td.column-4:after, section#ranking .content__Box.ranking .detail .tablepress td.column-5:after, section#ranking .content__Box.ranking .detail .tablepress td.column-6:after, section#ranking .content__Box.ranking .detail .tablepress td.column-7:after{content: "pt"; display: inline-block; font-size: 0.75rem; margin: 0 3px;} section#ranking .content__Box.system .detail .data-box{background: #f6f6f6; padding: 2rem;} section#ranking .content__Box.system .detail .data-box table{width: 100%; border-collapse: collapse;} section#ranking .content__Box.system .detail .data-box table th{background: #efefef; font-weight: 600; line-height: 1.4; padding: 0.5rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#ranking .content__Box.system .detail .data-box table td {border: solid 1px #ddd; white-space: nowrap;} section#ranking .content__Box.system .detail .data-box table td{vertical-align: middle; padding: 0.75rem 1.0rem; text-align: center;} section#ranking .content__Box.system .detail .data-box table td.desc {width: 70%; font-weight: 600; text-align: left;} section#ranking .content__Box.system .detail .data-box .tablebox {overflow-x: scroll; margin: 0 0 1.5rem;} section#ranking .content__Box.system .tips{font-size: 0.8rem; line-height: 1.4rem; border: solid 1px #ddd; background: #fefefe; padding: 1rem;} section#ranking .content__Box.system .tips ol{list-style: revert; margin: 0.5rem 0 0.5rem 2.2em;} /*tablet*/ @media (max-width: 1024px) { section#ranking .content__Box{margin: 0 0 1.5rem;} section#ranking .content__Box h3{font-size: 1.4rem; margin-bottom: 1.0rem;} section#ranking .content__Box h3:before{content: ''; width: 35px;} section#ranking .content__Box.gf-entry .list ul > li{width: 31.33%; padding: 0.5rem; margin: 1.0%;} section#ranking .content__Box.gf-entry .list ul > li .rank-main{flex-direction: column;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-status{width: 62px; margin-bottom: 0.15rem;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-logo{padding: 0 0 0.5rem;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-info{text-align: center; margin-bottom: 0.5rem;} section#ranking .content__Box.gf-entry .list ul > li .rank-main .team-info .team-name{font-size: 1.0rem;} section#ranking .content__Box.ranking date{margin: -2.45rem 0 1.5rem;} section#ranking .content__Box.ranking .detail .tablepress>:where(thead,tfoot)>*>th {font-size: 1.0rem; font-weight: 500; line-height: 1; text-align: center; background-color: #423b3b; padding: 1rem;} section#ranking .content__Box.system .detail .data-box table th{font-size: 0.8rem; padding: 0.75rem;} section#ranking .content__Box.system .tips{padding: 0.75rem;} section#ranking .content__Box.system .tips ol{margin: 0.25rem 0 0.25rem 2.25em;} } /*smart phone*/ @media (max-width: 430px) { section#ranking .content__Box.gf-entry .list ul > li{width: 48%; padding: 0.5rem; margin: 1.0%;} section#ranking .content__Box.ranking date{margin: -0.85rem 0 1.25rem; text-align: left;} } /*========= Campaign =========*/ section#event {} section#event .categories {position: relative; overflow: hidden; height: 60px; margin: 1rem 0;} section#event .categories ul.news__lists {display: flex; flex-wrap: nowrap; white-space: nowrap;} section#event .categories ul.news__lists > li {flex: 1 0 195px; display: inline-block;} section#event .categories ul.news__lists > li a {display: block; background-color: #fff; color: #b81d21; font-size: 1.2rem; font-weight: bold; text-align: center; padding: 0 5px; position: relative; transition: 0.3s all linear; line-height: 58px; border: 1px solid #b81d21;} section#event .categories ul.news__lists > li a.active:hover{color: #fff !important;} section#event .categories ul.news__lists > li a.active {background-color: #b81d21; color: #fff;} section#event .categories ul.news__lists > li a:not(.active):after {content: ''; position: absolute; bottom: 0; left: 0; width: 12px; height: 100%; background: #b81d21; color: #fff; transform: scale(0, 1); transform-origin: left top; transition: transform 0.3s;} section#event .categories ul.news__lists > li a[data-id="cat_kanto"]:not(.active):after {background-color: #b81d21;} section#event .categories ul.news__lists > li a[data-id="cat_tokai"]:not(.active):after {background-color: #b81d21;} section#event .categories ul.news__lists > li a[data-id="cat_online"]:not(.active):after {background-color: #1bb3ae;} section#event .categories ul.news__lists > li a[data-id="cat_game"]:not(.active):after {background-color: #f14408;} section#event .categories ul.news__lists > li a[data-id="cat_campaign"]:not(.active):after {background-color: #b2ad82;} section#event .categories ul.news__lists > li a[data-id="cat_other"]:not(.active):after {background-color: #999999;} section#event .categories ul.news__lists > li a:not(.active):hover::after {transform: scale(1, 1); -webkit-transform: scale(1, 1);} section#event .categories ul.news__lists > li:not(:first-child) {margin-left: 10px;} section#event .category__posts{margin-bottom: 2rem;} section#event .category__posts .posts ul.news-list > li{width: 31%; min-height: 525px; background: #fff; margin: 1%; overflow: hidden;} section#event .category__posts .posts ul.news-list > li figure{display: block; width: 100%; height: auto;} section#event .category__posts .posts ul.news-list > li figure img{width: 100%; height: 100%; max-width: 640px;} section#event .category__posts .posts dd{padding: 1rem;} section#event .category__posts .posts dd .news-data{align-items: center;} section#event .category__posts .posts dd .news-data time{color: #000; font-size: 0.85rem; margin-right: 5px;} section#event .category__posts .posts dd .news-data object .term-categories{display: inline-block; background-color: #333; color: #fff; font-size: 0.65rem; line-height: 1; padding: 4px 8px 5px; letter-spacing: 1px; vertical-align: 2px; margin: 0 0.1rem;} section#event .category__posts .posts dd .news-data object .term-categories.cat_kanto{background-color: #b81c22;} section#event .category__posts .posts dd .news-data object .term-categories.cat_online{background-color: #1bb3ae;} section#event .category__posts .posts dd .news-data object .term-categories.cat_tokai{background-color: #b81c22;} section#event .category__posts .posts dd .news-data object .term-categories.cat_game{background-color: #f14408;} section#event .category__posts .posts dd .news-data object .term-categories.cat_campaign{background-color: #b2ad82;} section#event .category__posts .posts dd .news-data object .term-categories.cat_other{background-color: #999999;} section#event .category__posts .posts dd .news-title{font-size: 0.95rem; padding: 0.25rem 0;} section#event .category__posts .posts a .news-title {color: #000;} section#event .category__posts .posts a:hover .news-title {color: #b81c22;} section#event .btnArea{max-width: 280px; margin: 0 auto;} section#event .btnArea a{width: 100%; background: #fff; color: #333; border: 1px solid #333; display: flex; align-items: center; justify-content: center; padding: 0.8rem; flex-direction: column; text-align: center; position: relative;} section#event .btnArea a:hover{border: 1px solid #b81c22;} section#event .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#event .btnArea a:hover:after{border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} section#event .newsDetail{width: 100%; margin-bottom: 3rem;} section#event .newsDetail time{color: #b81c22; font-size: 0.9rem; font-weight: 700;} section#event .newsDetail h3.news-title{font-size: 2.0rem; line-height: 1.25em; padding: 1.0rem 0;} section#event .newsDetail object .term-categories{display: inline-block; background-color: #333; color: #fff; font-size: 0.75rem; line-height: 1; padding: 10px 15px; letter-spacing: 1px; vertical-align: 2px; margin: 0 0.1rem;} section#event .newsDetail object .term-categories.cat_kanto{background-color: #b81c22;} section#event .newsDetail object .term-categories.cat_online{background-color: #1bb3ae;} section#event .newsDetail object .term-categories.cat_tokai{background-color: #b81c22;} section#event .newsDetail object .term-categories.cat_game{background-color: #f14408;} section#event .newsDetail object .term-categories.cat_campaign{background-color: #b2ad82;} section#event .newsDetail object .term-categories.cat_other{background-color: #999999;} section#event .newsDetail figure{display: block; text-align: center;} section#event .newsDetail figure img{width: 100%; max-width: 500px; height: auto;} section#event .newsDetail .news-text{} section#event .newsDetail .news-text h4{font-size: 2rem; line-height: 1em; font-weight: 500;} section#event .newsDetail .news-text h5{font-size: 1.6rem; line-height: 1em;} section#event .newsDetail .news-text p{line-height: 2.0em;} section#event .newsDetail .news-text hr{display: block; background: #ccc; width: 100%; height: 1px; line-height: 0; margin: 3rem 0; border: 0;} section#event .newsDetail .news-text a{color: #333; text-decoration: underline;} section#event .newsDetail .news-text a.arrow{display: inline-block; padding: 0 0 0 1rem; position: relative;} section#event .newsDetail .news-text a.arrow::before {content: ''; width: 8px; height: 8px; border-top: solid 3px #b81d21; border-right: solid 3px #b81d21; position: absolute; left: 3px; top: 10px; transform: rotate(45deg);} section#event .newsDetail .news-text ul.images > li{width: 100%; margin: 1%;} section#event .newsDetail .news-text ul.images > li.col-12{width: 100%;} section#event .newsDetail .news-text ul.images > li.col-6{width: 48%;} section#event .newsDetail .news-text ul.images > li.col-3{width: 31.333%;} section#event .newsDetail .news-text .tablebox{overflow-x: scroll;} section#event .newsDetail .news-text table{border-collapse:collapse;} section#event .newsDetail .news-text table th{white-space: nowrap;} section#event .newsDetail .news-text table td{border: solid 1px #ddd; white-space: nowrap;} section#event .newsDetail .news-text table th{font-weight: 600; line-height: 1.4; padding: 1.0rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#event .newsDetail .news-text table td{vertical-align: middle; padding: 1rem;} section#event .newsDetail .news-text .news-movie {width: 100%; position: relative; padding-top: 56.25%;} section#event .newsDetail .news-text .news-movie iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 3%; background: #423b3b;} section#event .pager{display: flex; justify-content: center; align-items: flex-start;} section#event .pager .page-numbers{font-size: 1.225rem; font-weight: 700; line-height: 1; margin: 0.5rem 0.75rem;} section#event .pager span.current{display: inline-block; color: #b81c22; position: relative;} section#event .pager span.current:after{content: ''; display: block; position: absolute; bottom: -7px; background: #b81c22; width: 110%; height: 3px;} section#event .pager .page-numbers.next, section#event .pager .page-numbers.prev{color: #b81c22;} section#event .pager a.page-numbers{color: #ccc;} /*tablet*/ @media (max-width: 1024px) { section#event .categories {height: 50px; margin: 0 0 1rem;} section#event .categories ul.news__lists > li {flex: 1 0 99px;} section#event .categories ul.news__lists > li a {font-size: 0.9rem; line-height: 48px;} section#event .categories ul.news__lists > li:not(:first-child) {margin-left: 5px;} section#event .category__posts .posts ul.news-list > li{width: 100%; min-height: auto; margin: 0 0 1.0rem;} section#event .category__posts .posts dl{display: flex; justify-content: flex-start; align-items: center;} section#event .category__posts .posts dt{width: 30%;} section#event .category__posts .posts dd{width: 70%; padding: 0.5rem;} section#event .category__posts .posts dd .news-data {flex-direction: row;} section#event .category__posts .posts dd .news-data time{font-size: 1.0rem; margin-right: 10px;} section#event .category__posts .posts dd .news-title{font-size: 1.0rem; padding: 0.25rem 0;} section#event .newsDetail{margin-bottom: 2rem;} section#event .newsDetail h3.news-title{font-size: 1.6rem;} section#event .newsDetail object .term-categories{font-size: 0.6rem; padding: 8px 10px; margin: 0.1rem;} section#event .newsDetail .news-text h4{font-size: 1.4rem; line-height: 1.4em;} section#event .newsDetail .news-text h5{font-size: 1.6rem;} section#event .newsDetail .news-text hr{margin: 2rem 0;} section#event .newsDetail .news-text ul.images > li.col-12, section#event .newsDetail .news-text ul.images > li.col-6, section#event .newsDetail .news-text ul.images > li.col-3{width: 100%; max-width: 620px; margin: 1% auto;} section#event .pager .prev_next_list{flex-direction: row;} section#event .pager .prev_next_list .ttl{font-size: 1.0rem;} } /*smart phone*/ @media (max-width: 430px) {} /*========= About =========*/ section#about{} section#about .content__Box h3 {font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#about .content__Box h3:before {content: ''; display: block; background: #b81d21; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#about .content__Box h4{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem;} section#about .content__Box h4:before{content: ''; display: block; background: #b81d21; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#about .content__Box p{font-size: 0.945rem; line-height: 1.65em; letter-spacing: 1px;} section#about .content__Box span.notice{display: block; font-size: 0.75rem;} section#about .content__Box table{width: 100%; border-collapse: separate; border-spacing: 0; background-color: #fff;} section#about .content__Box th{color: #fff; text-align: center; font-size: 0.9rem; font-weight: 600; padding: 10px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; background-color: #999;} section#about .content__Box td{color: #27313C; border-right: 1px solid #F2F2F2; border-top: 1px solid #F2F2F2; border-bottom: none} section#about .content__Box td{padding: 20px;} section#about .content__Box td:last-child {border-right: 0 none;} section#about .content__Box td ul{list-style: disc; margin: 0 0 0 1.5rem;} section#about .content__Box .about-img{margin-bottom: 0.75rem; border-radius: 15px; overflow: hidden;} section#about .content__Box .align-center{width: 60%; margin: 0 auto;} section#about .content__Box .card-body p{height: 100px;} section#about .content__Box .detail{margin: 0 0 3rem;} section#about .content__Box .detail:last-of-type{margin: 0;} section#about .content__Box .detail .flex{justify-content: space-between;} section#about .content__Box .detail .col{width: 33.333%; padding: 1%;} section#about .content__Box .detail .col a{color: #333;} section#about .content__Box .detail .col .detail {color: initial;} section#about .content__Box .detail .col a:hover .area-img{opacity: 0.85; transition: 0.3s all linear;} section#about .content__Box .detail ul{list-style: disc; margin: 1rem 0 1rem 2rem;} section#about .content__Box .detail ul > li{margin: 0.5rem 0;} section#about .content__Box .detail .area-img{padding: 0.75rem 0;} section#about .content__Box .detail .area-info .area-title{display: block; margin-bottom: 0.5rem; font-size: 1.15rem; font-weight: 700;} section#about .content__Box .detail .area-info .area-desc{font-size: 0.945rem; letter-spacing: 1px;} section#about .content__Box .detail .btnArea{max-width: 300px; margin: 0 auto;} section#about .content__Box .detail .btnArea a{width: 100%; background: #fff; color: #333; border: 1px solid #333; display: flex; align-items: center; justify-content: center; padding: 0.8rem; flex-direction: column; text-align: center; position: relative;} section#about .content__Box .detail .btnArea a:hover{border: 1px solid #b81c22;} section#about .content__Box .detail .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#about .content__Box .detail .btnArea a:hover:after{border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} section#about .content__Box .entry{width: 48%; margin-bottom: 2rem;} section#about .content__Box .entry a{color: #000;} section#about .content__Box .entry a:hover .about-img {opacity: 0.85; transition: 0.3s all linear;} section#about .content__Box .entry p.arrow{display: inline-block; padding: 0 0 0 1rem; position: relative;} section#about .content__Box .entry p.arrow::before {content: ''; width: 8px; height: 8px; border-top: solid 3px #b81d21; border-right: solid 3px #b81d21; position: absolute; left: 3px; top: 8px; transform: rotate(45deg);} section#about .content__Box .entry a:hover p.arrow{color: #b81c22; transition: 0.3s all linear;} section#about .beginner{display: flex; justify-content: center; align-items: center; border-radius: 15px; background-image: url(../img/general/one__pickup_large.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; padding: 5rem; margin: 1.5rem 0;} section#about .beginner .begin-text .inner-begin{display: flex; align-items: center; flex-direction: column;} section#about .beginner .begin-text .inner-begin img{width: 100%; max-width: 64px;} section#about .beginner .begin-text span.sub-text{color: #fff; font-size: 1.4rem; font-weight: 300; letter-spacing: 2px; margin: 0.45rem 0 0;} section#about .beginner .begin-text div.main-text{width: 100%; margin: 1.2rem 0;} section#about .beginner .begin-text div.main-text img{width: 100%; max-width: 260px;} section#about .content__Box .detail.fee .tablebox {overflow-x: scroll; margin: 0 0 0.5rem;} section#about .content__Box .detail.fee table{width: 100%; border-collapse: collapse;} section#about .content__Box .detail.fee table th{width: 120px; background: #b81d21; font-size: 1.1rem; padding: 0.5rem 2.0rem; white-space: nowrap;} section#about .content__Box .detail.fee table td {border: solid 1px #ddd; white-space: nowrap;} section#about .content__Box .detail.fee table td{vertical-align: middle; padding: 0.75rem 1.0rem; line-height: 1.15; text-align: center;} section#about .content__Box .detail.fee table td span{font-size: 0.75rem;} /*tablet*/ @media (max-width: 1024px) { section#about .content__Box h3 {font-size: 1.4rem; margin-bottom: 1.0rem;} section#about .content__Box th{width: 85px;} section#about .content__Box td{padding: 15px;} section#about .content__Box td ul{margin: 0 0 0 1.5rem;} section#about .content__Box .align-center{width: 100%; max-width: 420px; padding: 0; margin: 0 auto;} section#about .content__Box .card-body{margin-bottom: 2rem;} section#about .content__Box .card-body p {height: auto;} section#about .content__Box .detail{margin: 0 0 2rem;} section#about .content__Box .detail .col{width: 100%; max-width: 620px; padding: 0; margin: 0 auto;} section#about .content__Box .detail .area-info .area-title{margin-bottom: 0.25rem; font-size: 1.0rem;} section#about .content__Box .detail .area-info .area-desc{display: inline-block; font-size: 0.8rem; line-height: 1.5em;} section#about .content__Box .entry{width: 100%; max-width: 620px; margin: 0.75rem auto;} section#about .content__Box .entry p.arrow::before {content: ''; border-top: solid 2px #b81d21; border-right: solid 2px #b81d21; left: 0;} section#about .beginner{max-width: 620px; padding: 5rem 2.5rem; margin: 1rem auto;} section#about .beginner .begin-text .inner-begin img{max-width: 48px;} section#about .beginner .begin-text span.sub-text{font-size: 1.15rem; margin: 0.5rem 0 0;} section#about .beginner .begin-text div.main-text{margin: 0.65rem 0 1.0rem;} section#about .beginner .begin-text div.main-text img{max-width: 160px;} section#about .content__Box .detail.fee table th{width: 100%; font-size: 0.95rem;} section#about .content__Box .detail.fee table td span{font-size: 0.65rem;} } /*smart phone*/ @media (max-width: 430px) {} /*========= Beginner =========*/ section#beginner{padding: 0;} section#beginner .font-bgn {font-family: "Oswald", serif; font-weight: 600; font-optical-sizing: auto;} section#beginner .bgn__hero{position: relative;} section#beginner .bgn__hero:after{content: ''; display: block; width: 100vw; height: 400px; position: fixed; top: 125px; left: 0; background-image: url(../img/general/beginner/one__kv_bg_pc.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 0;} section#beginner .beginner {display: flex; justify-content: center; align-items: center; position: relative; padding: 6rem;} section#beginner .begin-text{position: relative; z-index: 1;} section#beginner .begin-text .inner-begin{width: 260px; display: flex; align-items: center; flex-direction: column;} section#beginner .begin-text .inner-begin img{width: 100%; max-width: 64px;} section#beginner .begin-text span.sub-text{color: #fff; font-size: 1.4rem; font-weight: 300; letter-spacing: 2px; margin: 0.45rem 0 0;} section#beginner .begin-text div.main-text{width: 100%; margin: 1.2rem 0;} section#beginner .begin-text div.main-text img{width: 100%; max-width: 260px;} section#beginner .bgn__nav{padding: 2.5rem 0; position: relative;} section#beginner .bgn__nav ul{width: 100%; max-width: 1240px; margin: 0 auto; display: flex; align-items: flex-start; justify-content: space-between;} section#beginner .bgn__nav ul > li a{color: #898989; position: relative;} section#beginner .bgn__nav ul > li a:hover{color: #e67373 !important;} section#beginner .bgn__nav ul > li a:after{content: ''; display: block; background: #e67373; height: calc(tan(60deg)* 14px / 2); width: 26px; clip-path: polygon(0 0, 100% 0, 50% 100%); margin: 0 auto;} section#beginner .bgn__nav ul > li span{font-size: 3.4rem; font-weight: 600;} section#beginner .bgn__nav ul > li span.nav-number{font-style: italic;} section#beginner .bgn__nav ul > li span.nav-text{font-size: 1.4rem; font-weight: 600;} section#beginner .wrapper{max-width: none; background-color: #fafafa; background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23ae73e6' fill-opacity='0.03' fill-rule='evenodd'/%3E%3C/svg%3E");} section#beginner .content__Box{width: 100%; max-width: 1240px; margin: 0 auto; padding: 0; position: relative;} section#beginner .beginner-headline h3.bgn__headline-title{text-align: center; line-height: 1;} section#beginner .beginner-headline .bgn__headline-title .headline-title-number{font-size: 10rem; font-style: italic; color: #e67373; line-height: 1;} section#beginner .beginner-headline .bgn__headline-title .headline-title-text{display: block; font-size: 1.8rem; font-weight: 600; margin-top: 1rem;} section#beginner .content__Box .beginner-catch h4{text-align: center; margin: 3rem 0; font-size: 2.4rem; font-weight: 600;} section#beginner .content__Box .beginner-catch .catch-image{width: 70%; margin: 0 auto;} section#beginner #bgn_cont1.content__Box ul{display: flex; justify-content: space-between; margin: 3rem 0; position: relative;} section#beginner #bgn_cont1.content__Box ul > li{width: 31.33%;} section#beginner #bgn_cont1.content__Box ul > li .item-image{border-radius: 15px; overflow: hidden;} section#beginner #bgn_cont1.content__Box ul > li dl{} section#beginner #bgn_cont1.content__Box ul > li dt{text-align: center; margin-top: -2.5rem;} section#beginner #bgn_cont1.content__Box ul > li dt p.font-large{font-size: 4rem; font-weight: 700; line-height: 1; font-variant: petite-caps; margin-bottom: 0.5rem;} section#beginner #bgn_cont1.content__Box ul > li dt p.font-gra{display: inline-block; background: linear-gradient(180deg, #f08282 50%, #cc1015 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;} section#beginner #bgn_cont1.content__Box ul > li dt span.item-title-text{display: block; font-size: 1.4rem; font-weight: 700;} section#beginner #bgn_cont1.content__Box ul > li dd{margin: 0.75rem 0; font-size: 1rem; line-height: 1.6em;} section#beginner #bgn_cont2 .detail{background-image: url(../img/general/beginner/one__bgn_cont2_bg.jpg); background-repeat: no-repeat; background-size: cover; position: relative; margin: 15rem 0 3rem;} section#beginner #bgn_cont2 .detail .beginner-headline{top: -15rem; display: block; position: relative;} section#beginner #bgn_cont2 .detail .promotion_catch{margin: -12rem 0 0; padding: 12rem 0;} section#beginner #bgn_cont2 .detail .promotion_catch h3{color: #fff; text-align: center; font-size: 4.0rem; font-weight: 700;} section#beginner #bgn_cont2 .detail .promotion_catch .promotion_logo{width: 100%; max-width: 360px; margin: 0.75rem auto;} section#beginner #bgn_cont2 .detail .promotion_catch .btnArea {max-width: 300px; margin: 5rem auto 0;} section#beginner #bgn_cont2 .detail .promotion_catch .btnArea a{width: 100%; background: #fff; color: #333; border-radius: 30px; display: flex; align-items: center; justify-content: center; padding: 0.8rem; flex-direction: column; text-align: center; position: relative;} section#beginner #bgn_cont2 .detail .promotion_catch .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#beginner #bgn_cont2 .detail .promotion_catch .btnArea a:hover:after{border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} section#beginner #bgn_cont3 .detail{margin: 3rem 0 5rem;} section#beginner #bgn_cont3 .detail ul > li{margin: 0 0 3rem;} section#beginner #bgn_cont3 .detail ul > li:last-child{margin: 0;} section#beginner #bgn_cont3 .detail ul > li:nth-child(2) dl{flex-direction: row;} section#beginner #bgn_cont3 .detail dl{width: 100%; display: flex; justify-content: flex-start; align-items: center; flex-direction: row-reverse;} section#beginner #bgn_cont3 .detail dt{width: 50%; overflow: hidden; border-radius: 15px;} section#beginner #bgn_cont3 .detail dd{width: 50%; padding: 2.5%;} section#beginner #bgn_cont3 .detail dd div{margin-bottom: 1.5rem;} section#beginner #bgn_cont3 .detail dd div span{display: block; font-size: 1.5rem; font-weight: 700; letter-spacing: 1px;} section#beginner #bgn_cont3 .detail dd p{line-height: 1.8rem;} section#beginner #bgn_cont3 .detail dd p.font-large{font-size: 5.5rem; font-weight: 600; line-height: 1; font-variant: petite-caps;} section#beginner #bgn_cont3 .detail dd p.font-gra{display: inline-block; background: linear-gradient(180deg, #f08282 50%, #cc1015 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;} section#beginner #bgn_cont3 .detail .btnArea{max-width: 300px; margin: 0 auto;} section#beginner #bgn_cont3 .detail .btnArea a{width: 100%; background: #fff; color: #333; border: 1px solid #333; display: flex; align-items: center; justify-content: center; padding: 0.8rem; flex-direction: column; text-align: center; position: relative;} section#beginner #bgn_cont3 .detail .btnArea a:hover{border: 1px solid #b81c22;} section#beginner #bgn_cont3 .detail .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#beginner #bgn_cont3 .detail .btnArea a:hover:after{border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} section#beginner #bgn_cont4 .detail{background: #30274a; color: #fff; padding: 0 0 5rem;} section#beginner #bgn_cont4 .detail h5{font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#beginner #bgn_cont4 .detail h5:before{content: ''; background: #e67373; display: block; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#beginner #bgn_cont4 .detail h6{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0.5rem 0; padding: 0 0 0 0.55rem;} section#beginner #bgn_cont4 .detail h6:before{content: ''; display: block; background: #e67373; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#beginner #bgn_cont4 .detail .beginner-headline{top: -5rem; display: block; position: relative; margin: 0 0 -2.5rem;} section#beginner #bgn_cont4 .content__Box p{line-height: 1.8rem;} section#beginner #bgn_cont4 .content__Box p a{color: #fff; text-decoration: underline;} section#beginner #bgn_cont4 .content__Box ul.entry_area{list-style: disc; margin: 0 0 0 1.75em;} section#beginner #bgn_cont4 .content__Box ul.entry_area > li{margin-bottom: 0.25rem;} section#beginner #bgn_cont4 .content__Box ul.entry_area a{color: #fff; text-decoration: underline;} section#beginner #bgn_cont4 .content__Box .toggle {width: 100%; margin: 1.5rem 0;} section#beginner #bgn_cont4 .content__Box .toggle:not([open]) {} section#beginner #bgn_cont4 .content__Box .toggle summary {display: flex; justify-content: space-between; align-items: center; position: relative; padding: 1.5rem 1.5rem 1.5rem 2.5rem; background-color: #f8f8f8; color: #000; font-weight: 600; font-size: 1.4rem; cursor: pointer;} section#beginner #bgn_cont4 .content__Box .toggle summary::-webkit-details-marker {display: none;} section#beginner #bgn_cont4 .content__Box .toggle summary::before{content: ''; display: block; position: absolute; /* top: 0; */ left: 20px; width: 16px; height: 16px; border: solid 4px #ae1f1f; border-radius: 50%;} section#beginner #bgn_cont4 .content__Box .toggle summary::after {content: ''; transform: translateY(-25%) rotate(45deg); width: 18px; height: 18px; border-bottom: 3px solid #ae1f1f; border-right: 3px solid #ae1f1f; transition: transform .3s;} section#beginner #bgn_cont4 .content__Box .toggle[open] summary::after {transform: rotate(225deg);} section#beginner #bgn_cont4 .content__Box .toggle .toggle_detail {font-size: 1.35rem; color: #fff; margin: 0; padding: 1.5rem 0 0.5rem; transition: transform .5s, opacity .5s; transform: translateY(-10px); opacity: 0;} section#beginner #bgn_cont4 .content__Box .toggle .toggle_detail span{display: block; font-size: 0.85rem;} section#beginner #bgn_cont4 .content__Box .toggle .toggle_detail ul > li{margin-bottom: 0.5rem;} section#beginner #bgn_cont4 .content__Box .toggle .toggle_detail ul.list_dot{list-style: disc; margin: 0 0 0 1.75em;} section#beginner #bgn_cont4 .content__Box .toggle[open] .toggle_detail {transform: none; opacity: 1;} section#beginner #bgn_cont4 .content__Box .desc_image span{font-size: 0.8rem; line-height: 1.4rem; margin: 1rem 0 0; display: block;} /*tablet*/ @media (max-width: 1024px) { section#beginner .bgn__hero:after{content: ''; height: 320px; top: 55px;} section#beginner .beginner {padding: 3rem} section#beginner .begin-text .inner-begin img{max-width: 48px;} section#beginner .begin-text span.sub-text{font-size: 1.15rem; margin: 0.5rem 0 0;} section#beginner .begin-text div.main-text{text-align: center; margin: 0.65rem 0 1.0rem;} section#beginner .begin-text div.main-text img{max-width: 160px;} section#beginner .bgn__nav{padding: 1.25rem 0.75rem;} section#beginner .bgn__nav ul{width: 100dvw; width: 100%;} section#beginner .bgn__nav ul > li{width: 50%;} section#beginner .bgn__nav ul > li a:after{width: 15px; clip-path: polygon(0 0, 100% 0, 50% 75%); margin: 3px 0 0 10px;} section#beginner .bgn__nav ul > li span{font-size: 1.75rem;} section#beginner .bgn__nav ul > li span.nav-text{font-size: 0.95rem;} section#beginner .content__Box{width: 90%;} section#beginner .beginner-headline .bgn__headline-title .headline-title-number{font-size: 5rem;} section#beginner .beginner-headline .bgn__headline-title .headline-title-text{font-size: 1.15rem; margin-top: 0.75rem;} section#beginner .content__Box .beginner-catch h4{margin: 1.5rem 0; font-size: 1.4rem;} section#beginner .content__Box .beginner-catch .catch-image{width: 100%; max-width: 640px; margin: 0 auto 1rem;} section#beginner #bgn_cont1.content__Box ul{width: 80%; max-width: 500px; flex-direction: column; margin: 0 auto;} section#beginner #bgn_cont1.content__Box ul > li{width: 100%; margin: 1rem 0;} section#beginner #bgn_cont1.content__Box ul > li dt p.font-large{font-size: 3.6rem;} section#beginner #bgn_cont1.content__Box ul > li dt span.item-title-text{font-size: 1.25rem;} section#beginner #bgn_cont1.content__Box ul > li dd{margin: 0.5rem 0 0;} section#beginner #bgn_cont2 .detail{margin: 8.5rem 0 1.5rem;} section#beginner #bgn_cont2 .detail .beginner-headline{top: -8rem;} section#beginner #bgn_cont2 .detail .promotion_catch{margin: -7rem 0 0; padding: 3rem 0;} section#beginner #bgn_cont2 .detail .promotion_catch h3{font-size: 3.2rem; line-height: 1.25em;} section#beginner #bgn_cont2 .detail .promotion_catch .promotion_logo{max-width: 180px; margin: 1.4rem auto;} section#beginner #bgn_cont2 .detail .promotion_catch .btnArea {max-width: 260px; margin: 2.5rem auto 0;} section#beginner #bgn_cont3 .detail{margin: 2rem 0 5rem;} section#beginner #bgn_cont3 .detail ul > li:nth-child(2) dl{flex-direction: column;} section#beginner #bgn_cont3 .detail dl{width: 100%; max-width: 500px; margin: 0 auto; flex-direction: column;} section#beginner #bgn_cont3 .detail dt{width: 100%;} section#beginner #bgn_cont3 .detail dd{width: 100%; padding: 0;} section#beginner #bgn_cont3 .detail dd div{margin-bottom: 0.75rem;} section#beginner #bgn_cont3 .detail dd div span{font-size: 1.2rem;} section#beginner #bgn_cont3 .detail dd p{line-height: 1.6rem;} section#beginner #bgn_cont3 .detail dd p.font-large{font-size: 4.1rem;} section#beginner #bgn_cont4 .detail{padding: 0 0 4rem;} section#beginner #bgn_cont4 .detail h5{font-size: 1.4rem; margin-bottom: 1.0rem;} section#beginner #bgn_cont4 .detail .beginner-headline{top: -3.5rem; margin: 0 0 -0.5rem;} section#beginner #bgn_cont4 .content__Box p{line-height: 1.6rem;} section#beginner #bgn_cont4 .content__Box .toggle {margin: 0.75rem 0;} section#beginner #bgn_cont4 .content__Box .toggle summary {padding: 0.75rem 1.0rem 0.75rem 1.5rem; font-size: 1.2rem;} section#beginner #bgn_cont4 .content__Box .toggle summary::before{content: ''; left: 5px; width: 13px; height: 13px; border: solid 3px #ae1f1f;} section#beginner #bgn_cont4 .content__Box .toggle summary::after {content: ''; width: 12px; height: 12px;} section#beginner #bgn_cont4 .content__Box .toggle .toggle_detail {font-size: 1.15rem; padding: 0.75rem 0;} section#beginner #bgn_cont4 .content__Box .toggle .toggle_detail ul.list_dot{margin: 0 0 0 1.4em;} section#beginner #bgn_cont4 .content__Box .desc_image span{margin: 0.5rem 0 0;} } @media (max-width: 767px) { section#beginner .bgn__nav ul{width: 95dvw; width: 95%;} section#beginner .bgn__nav ul{flex-wrap: wrap;} } /*smart phone*/ @media (max-width: 430px) { section#beginner #bgn_cont2 .detail .promotion_catch h3{font-size: 2.4rem;} section#beginner .bgn__nav ul > li span{font-size: 1.6rem;} section#beginner .bgn__nav ul > li span.nav-text{font-size: 0.85rem;} } /*========= Playoff =========*/ section#playoff{padding: 0;} section#playoff .wrapper{background: #fafafa; max-width: none; padding: 3rem 0;} section#playoff .content__Box{width: 100%; max-width: 1240px; margin: 0 auto; padding: 0; position: relative;} section#playoff .content__Box h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#playoff .content__Box h3:before{content: ''; display: block; background: #b81d21; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#playoff .content__Box .detail{background: #f6f6f6; margin-bottom: 2.5rem;} section#playoff .content__Box .detail h4{background: #efefef; padding: 1.25rem; font-size: 1.35rem; line-height: 1em;} section#playoff .content__Box .detail .data-box{font-size: 1rem; line-height: 1.85em; letter-spacing: 1px; padding: 1.25rem;} section#playoff .content__Box .detail .data-box h5{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem;} section#playoff .content__Box .detail .data-box h5:before{content: ''; display: block; background: #333; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#playoff .content__Box .detail .data-box p.notice{font-size: 0.75rem; line-height: 1.15rem;} section#playoff .content__Box .detail .data-box hr{border-bottom: 1px solid #ddd; border-top: none; margin: 1.5rem 0; padding: 0;} section#playoff .content__Box .detail .data-box .po__status{} section#playoff .content__Box .detail .data-box .po__status dl{display: flex; justify-content: flex-start; align-items: flex-start; margin: 0 0 0.75rem;} section#playoff .content__Box .detail .data-box .po__status dt{background: #b81c22; color: #fff; font-size: 0.85rem; font-weight: 600; line-height: 1; border-radius: 5px; padding: 0.5rem 0.85rem; margin: 0 0.5rem 0 0; min-width: 135px; text-align: center;} section#playoff .content__Box .detail .data-box .po__status dd{font-size: 1.35rem;} section#playoff .content__Box .detail .data-box ol{list-style: decimal; margin: 0 0 0 1.5em;} section#playoff .content__Box .detail .data-box ol > li, section#playoff .content__Box .detail .data-box ul > li{margin-bottom: 1.0rem;} section#playoff .content__Box .detail .data-box ul.list_dot{list-style: disc; margin: 0 0 0 2.5em;} section#playoff .content__Box .detail .data-box ul.list_num{list-style: decimal; margin: 0 0 0 2.5em;} section#playoff .content__Box .detail .data-box .btnArea{max-width: 430px;} section#playoff .content__Box .detail .data-box .btnArea a{width: 100%; background: #fff; color: #333; text-align: center; border: 1px solid #333; text-decoration: none; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0.8rem 2.4rem 0.8rem 0.8rem; position: relative;} section#playoff .content__Box .detail .data-box .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#playoff #matchList{overflow: hidden;} section#playoff #matchList .tablebox{overflow-x: scroll;} section#playoff .content__Box .tablepress>:where(thead,tfoot)>*>th {color: #fff; font-size: 1.0rem; font-weight: 500; line-height: 1; text-align: center; background-color: #423b3b; padding: 1rem;} section#playoff .content__Box .tablepress>:where(thead)+tbody>*>*, section#playoff .content__Box .tablepress>tbody>*~*>*, section#playoff .content__Box .tablepress>tfoot>:where(:first-child)>* {border: 1px solid var(--border-color);} section#playoff .content__Box .tablepress td{padding: 1.25rem 0.625rem;} section#playoff .content__Box .tablepress td.column-1, section#playoff .content__Box .tablepress td.column-2, section#playoff .content__Box .tablepress td.column-3{text-align: center;} /*tablet*/ @media (max-width: 1024px) { section#playoff .wrapper{padding: 1.25rem 0;} section#playoff .content__Box h3{font-size: 1.4rem; margin-bottom: 1.0rem;} section#playoff .content__Box h3:before{content: ''; width: 35px;} section#playoff .content__Box .detail{margin-bottom: 1.5rem;} section#playoff .content__Box .detail h4{padding: 0.75rem; font-size: 1.1rem;} section#playoff .content__Box .detail .data-box{padding: 1.0rem;} section#playoff .content__Box .detail .data-box p.notice{font-size: 1.0rem; line-height: 1.85em;} section#playoff .content__Box .detail .data-box .po__status dl{margin: 0 0 1.0rem; flex-direction: column;} section#playoff .content__Box .detail .data-box .po__status dt{font-size: 0.8rem; padding: 0.35rem 0.5rem 0.5rem; margin: 0 0 0.5rem 0; min-width: 105px;} section#playoff .content__Box .detail .data-box .po__status dd{font-size: 1.1rem;} section#playoff .content__Box .detail .data-box ol{margin: 0 0 0 1.25em;} section#playoff .content__Box .detail .data-box ol > li, section#playoff .content__Box .detail .data-box ul > li{margin-bottom: 0.75rem;} section#playoff .content__Box .detail .data-box ul.list_dot, section#playoff .content__Box .detail .data-box ul.list_num{margin: 0 0 0 1.25em;} section#playoff .content__Box .detail .data-box .btnArea{max-width: 320px;} section#playoff .content__Box .tablepress>:where(thead,tfoot)>*>th {padding: 0.75rem; white-space: nowrap;} section#playoff .content__Box .tablepress td{white-space: nowrap; font-size: 1.0rem; padding: 0.75rem;} } /*smart phone*/ @media (max-width: 430px) {} /*========= Season Final =========*/ section#SFinal{padding: 0;} section#SFinal .wrapper{background: #fafafa; max-width: none; padding: 3rem 0;} section#SFinal .content__Box{width: 100%; max-width: 1240px; margin: 0 auto; padding: 0; position: relative;} section#SFinal .content__Box h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#SFinal .content__Box h3:before{content: ''; display: block; background: #b81d21; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#SFinal .result_List{width: 100%; max-width: 1240px; margin: 0 auto;} section#SFinal .result_List ul.posts > li{width: 31%; background: #fff; margin: 1%; overflow: hidden;} section#SFinal .result_List ul.posts > li figure {display: block; width: 100%; height: auto;} section#SFinal .result_List ul.posts > li figure img {width: 100%; height: 100%; max-width: 640px;} section#SFinal .result_List ul.posts dd {padding: 1rem;} section#SFinal .result_List ul.posts dd .game-data {align-items: center;} section#SFinal .result_List ul.posts dd .game-data time {display: inline-block; background-color: #90825d; color: #fff; font-size: 0.65rem; line-height: 1; padding: 4px 8px 5px; letter-spacing: 1px; vertical-align: 2px; margin: 0;} section#SFinal .result_List ul.posts a .game-title {color: #000;} section#SFinal .result_List ul.posts a:hover .game-title {color: #b81c22;} section#SFinal .result_List ul.posts dd .game-title {font-size: 1.15rem; font-weight: 600; padding: 0.25rem 0 0;} section#SFinal .content__Box .sf__result{margin-bottom: 2.5rem;} section#SFinal .content__Box .sf__result .sf__champ{margin-bottom: 3rem;} section#SFinal .content__Box .sf__result .sf__runner ul{width: 100%;} section#SFinal .content__Box .sf__result .sf__runner ul > li{width: 31.33%; margin-right: 3%;} section#SFinal .content__Box .sf__result .sf__runner ul > li:last-child{margin-right: 0;} section#SFinal .content__Box .sf__detail{background: #f6f6f6; margin-bottom: 2.5rem;} section#SFinal .content__Box .sf__detail h4{background: #efefef; padding: 1.25rem; font-size: 1.35rem; line-height: 1em;} section#SFinal .content__Box .sf__detail .data-box{font-size: 1rem; line-height: 1.85em; letter-spacing: 1px; padding: 1.25rem;} section#SFinal .content__Box .sf__detail .data-box h5{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem;} section#SFinal .content__Box .sf__detail .data-box h5:before{content: ''; display: block; background: #333; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#SFinal .content__Box .sf__detail .data-box p.notice{font-size: 0.75rem; line-height: 1.15rem;} section#SFinal .content__Box .sf__detail .data-box hr{border-bottom: 1px solid #ddd; border-top: none; margin: 1.5rem 0; padding: 0;} section#SFinal .content__Box .sf__detail .data-box .tablebox{overflow-x: scroll;} section#SFinal .content__Box .sf__detail .data-box table{width: 100%; margin: 1rem 0; border-collapse: collapse;} section#SFinal .content__Box .sf__detail .data-box table th{white-space: nowrap;} section#SFinal .content__Box .sf__detail .data-box table td{border: solid 1px #ddd; white-space: nowrap;} section#SFinal .content__Box .sf__detail .data-box table th{background: #efefef; font-weight: 600; line-height: 1.4; padding: 0.5rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#SFinal .content__Box .sf__detail .data-box table td{vertical-align: middle; padding: 0.5rem 1.0rem; text-align: center;} section#SFinal .content__Box .sf__detail .data-box .entry dl{display: flex; justify-content: flex-start; align-items: flex-start; margin: 0 0 1.25rem;} section#SFinal .content__Box .sf__detail .data-box .entry dt{width: 15%; min-width: 135px; background: #b81c22; color: #fff; font-size: 0.85rem; font-weight: 600; line-height: 1; border-radius: 5px; padding: 0.5rem 0.85rem; margin: 0 0.5rem 0 0; text-align: center;} section#SFinal .content__Box .sf__detail .data-box .entry dd{width: 100%; font-size: 1.35rem;} section#SFinal .content__Box .sf__detail .data-box .offer{background: #e7e7e7; border: 4px solid #b81b22; padding: 2.5rem; border-radius: 15px;} section#SFinal .content__Box .sf__detail .data-box .offer p{font-size: 0.85rem; line-height: 1.5em; margin-bottom: 1rem;} section#SFinal .content__Box .sf__detail .data-box .offer .entry{align-items: center; margin-bottom: 1rem;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .images{width: 40%; margin-right: 5%;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail{width: 55%;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail ul{margin: 0 0 0 1.5rem;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail ul > li{font-size: 1.4rem; font-weight: 600; margin: 0 0 0.5rem;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail ul > li span{display: block; font-size: 0.75rem; line-height: 1.75em;} section#SFinal .content__Box .sf__detail .data-box ol{list-style: decimal; margin: 0 0 0 1.5em;} section#SFinal .content__Box .sf__detail .data-box ul > li{margin-bottom: 1.0rem;} section#SFinal .content__Box .sf__detail .data-box ol > li{margin-bottom: 0rem;} section#SFinal .content__Box .sf__detail .data-box ul.list_dot{list-style: disc; margin: 0 0 0 2.5em;} section#SFinal .content__Box .sf__detail .data-box ul.list_num{list-style: decimal; margin: 0 0 0 2.5em;} section#SFinal .content__Box .sf__detail .data-box ul.tips > li{margin: 0;} section#SFinal .content__Box .sf__detail .data-box ul.table{display: flex; justify-content: flex-start; align-items: flex-start; width: 60%;} section#SFinal .content__Box .sf__detail .data-box ul.table > li{width: 25%; margin: 0; border: 1px solid #999999; text-align: center;} section#SFinal .content__Box .sf__detail .data-box ul.table > li .tb__game{background: #8d8d8d; color: #fff; font-size: 1rem; padding: 0.25rem;} section#SFinal .content__Box .sf__detail .data-box ul.table > li .tb__time{padding: 0.5rem; font-size: 1.15rem;} section#SFinal #matchList, section#SFinal #roundRobin{overflow: hidden; margin-bottom: 2.5rem;} section#SFinal #matchList .tablebox, section#SFinal #roundRobin .tablebox{overflow-x: scroll;} section#SFinal .content__Box .tablepress>:where(thead,tfoot)>*>th {color: #fff; font-size: 1.0rem; font-weight: 500; line-height: 1; text-align: center; background-color: #423b3b; padding: 1rem;} section#SFinal .content__Box .tablepress>:where(thead)+tbody>*>*, section#SFinal .content__Box .tablepress>tbody>*~*>*, section#SFinal .content__Box .tablepress>tfoot>:where(:first-child)>* {border: 1px solid var(--border-color);} section#SFinal .content__Box .tablepress td{font-size: 1rem; padding: 1.25rem 0.625rem;} section#SFinal .content__Box .tablepress td.column-1, section#SFinal .content__Box .tablepress td.column-2, section#SFinal .content__Box .tablepress td.column-3{text-align: left;} section#SFinal .content__Box .tablepress td .add{width: 100%; max-width: 32px; display: inline-block; font-size: 0.55rem; font-weight: 600; text-align: center; line-height: 1; color: #fff; padding: 4px 5px 3px; border-radius: 3px; vertical-align: 3px; margin-right: 7px; background: #423b3b;} section#SFinal .content__Box .tablepress td .add.tel{background: #b81c22;} section#SFinal .content__Box .tablepress td .add.line{background: #06C755;} section#SFinal .content__Box .sf__detail .data-box .btnArea{max-width: 430px;} section#SFinal .content__Box .sf__detail .data-box .btnArea a{width: 100%; background: #fff; color: #333; text-align: center; border: 1px solid #333; text-decoration: none; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0.8rem 2.4rem 0.8rem 0.8rem; position: relative;} section#SFinal .content__Box .sf__detail .data-box .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} /*tablet*/ @media (max-width: 1024px) { section#SFinal .wrapper{padding: 1.5rem 0;} section#SFinal .content__Box h3{font-size: 1.275rem; margin-bottom: 1.0rem;} section#SFinal .content__Box h3:before{content: ''; width: 35px;} section#SFinal .result_List ul.posts > li{width: 100%; min-height: auto; margin: 0 0 1.0rem;} section#SFinal .result_List ul.posts dl{display: flex; justify-content: flex-start; align-items: center;} section#SFinal .result_List ul.posts dt{width: 30%;} section#SFinal .result_List ul.posts dd {width: 70%; padding: 0.5rem;} section#SFinal .result_List ul.posts dd .game-data {align-items: flex-start;} section#SFinal .result_List ul.posts dd .game-data time {font-size: 0.75rem; padding: 5px;} section#SFinal .result_List ul.posts dd .game-title {font-size: 1.0rem; padding: 0.25rem 0 0;} section#SFinal .content__Box .sf__result{margin-bottom: 1.5rem;} section#SFinal .content__Box .sf__result .sf__champ{margin-bottom: 1.5rem;} section#SFinal .content__Box .sf__result .sf__runner ul{flex-direction: row;} section#SFinal .content__Box .sf__result .sf__runner ul > li:nth-child(1){width: 50%; margin: 0 auto 1.0rem;} section#SFinal .content__Box .sf__result .sf__runner ul > li{width: 47%; margin-right: 5%;} section#SFinal .content__Box .sf__detail{margin-bottom: 1.5rem;} section#SFinal .content__Box .sf__detail h4{padding: 0.75rem; font-size: 1.1rem;} section#SFinal .content__Box .sf__detail .data-box{padding: 1.0rem;} section#SFinal .content__Box .sf__detail .data-box h5{font-size: 1.1rem; margin: 0 0 0.5rem;} section#SFinal .content__Box .sf__detail .data-box h5:before{height: 75%;} section#SFinal .content__Box .sf__detail .data-box p.notice{font-size: 0.8rem; line-height: 1.25rem;} section#SFinal .content__Box .sf__detail .data-box hr{margin: 0.75rem 0;} section#SFinal .content__Box .sf__detail .data-box .entry dl{margin: 0 0 1.5rem; flex-direction: column;} section#SFinal .content__Box .sf__detail .data-box .entry dt{width: 30%; min-width: 150px; font-size: 0.85rem; margin: 0 0 0.5rem 0;} section#SFinal .content__Box .sf__detail .data-box .entry dd{font-size: 1rem;} section#SFinal .content__Box .sf__detail .data-box .offer{width: 100%; max-width: 500px; margin: 0 auto; border: 3px solid #b81b22; padding: 0.75rem; border-radius: 10px;} section#SFinal .content__Box .sf__detail .data-box .offer .entry{margin-bottom: 0;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .images{width: 90%; margin: 1.0rem 0 1.25rem;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail{width: 90%;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail ul > li{font-size: 1.25rem;} section#SFinal .content__Box .sf__detail .data-box .offer .entry .detail ul > li span{line-height: 1.5em;} section#SFinal .content__Box .sf__detail .data-box ul.list_dot{margin: 0 0 0 1.5em;} section#SFinal .content__Box .sf__detail .data-box ul.list_num{margin: 0 0 0 1.5em;} section#SFinal .content__Box .sf__detail .data-box ul.table{width: 100%;} section#SFinal .content__Box .sf__detail .data-box ul.table > li .tb__game{font-size: 0.85rem; padding: 0.1rem;} section#SFinal .content__Box .sf__detail .data-box ul.table > li .tb__time{padding: 0.25rem; font-size: 1.0rem;} section#SFinal .content__Box .tablepress>:where(thead,tfoot)>*>th {padding: 0.75rem; white-space: nowrap;} section#SFinal .content__Box .tablepress td{white-space: nowrap; font-size: 1.0rem; padding: 0.75rem;} section#SFinal .content__Box .tablepress td .add{font-size: 0.65rem; vertical-align: 2px; margin-right: 10px;} } /*smart phone*/ @media (max-width: 430px) {} /*========= Grand Final =========*/ section#GFinal{padding: 0;} section#GFinal .font-GFinal {font-family: "Oswald", serif; font-weight: 600; font-optical-sizing: auto;} section#GFinal .wrapper{max-width: none; background-color: #b81d21;} section#GFinal .content__Box{width: 100%; max-width: 1240px; margin: 0 auto; padding: 0; position: relative;} section#GFinal .content__Box h3{font-size: 1.9rem; font-weight: 700; color: #fff; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#GFinal .content__Box h3:before{content: ''; display: block; background: #fff; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#GFinal .GFinal__hero{position: relative;} section#GFinal .GFinal__hero:after{content: ''; display: block; width: 100vw; height: 450px; position: fixed; top: 125px; left: 0; background-image: url(../img/general/grand/common/one__gf_kv_pc.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 0;} section#GFinal .GFinal__Title {display: flex; justify-content: center; align-items: center; position: relative; padding: 7.4rem;} section#GFinal .GFinal-text{position: relative; z-index: 1;} section#GFinal .GFinal-text .inner{width: 700px; display: flex; align-items: center; flex-direction: column; padding: 1.5rem 0;} section#GFinal .GFinal-text .inner img{width: 100%; max-width: 700px;} section#GFinal .GFinal__nav{background: #8f825b; padding: 0.5rem 0 1.5rem; position: relative;} section#GFinal .GFinal__nav ul{width: 100%; max-width: 1240px; margin: 0 auto; display: flex; align-items: flex-start; justify-content: space-between;} section#GFinal .GFinal__nav ul > li a{color: #fff; position: relative;} section#GFinal .GFinal__nav ul > li a:hover{color: #b81c22 !important;} section#GFinal .GFinal__nav ul > li a:after{content: ''; display: block; background: #504629; height: calc(tan(60deg)* 14px / 2); width: 26px; clip-path: polygon(0 0, 100% 0, 50% 100%); margin: 0 auto;} section#GFinal .GFinal__nav ul > li div.none{color: #6f6444; cursor: no-drop; position: relative;} section#GFinal .GFinal__nav ul > li span{font-size: 3.4rem; font-weight: 600;} section#GFinal .GFinal__nav ul > li span.nav-number{font-style: italic;} section#GFinal .GFinal__nav ul > li span.nav-text{font-size: 1.4rem; font-weight: 600;} section#GFinal .content__Box .detail{background: #f6f6f6; margin-bottom: 2.5rem;} section#GFinal .content__Box .detail h4{background: #efefef; padding: 1.25rem; font-size: 1.35rem; line-height: 1em;} section#GFinal .content__Box .detail .data-box{font-size: 1rem; line-height: 1.85em; letter-spacing: 1px; padding: 1.25rem;} section#GFinal .content__Box .detail .data-box h5{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem;} section#GFinal .content__Box .detail .data-box h5:before{content: ''; display: block; background: #b81c22; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#GFinal .content__Box .detail .data-box p.notice{font-size: 0.75rem; line-height: 1.15rem;} section#GFinal .content__Box .detail .data-box hr{border-bottom: 1px solid #ddd; border-top: none; margin: 1.5rem 0; padding: 0;} section#GFinal .content__Box .detail .data-box .entry a{color: #b81c22;} section#GFinal .content__Box .detail .data-box .entry a:hover{text-decoration: underline;} section#GFinal .content__Box .detail .data-box .entry dl{display: flex; justify-content: flex-start; align-items: flex-start; margin: 0 0 0.75rem;} section#GFinal .content__Box .detail .data-box .entry dt{background: #b81c22; color: #fff; font-size: 0.85rem; font-weight: 600; line-height: 1; border-radius: 5px; padding: 0.5rem 0.85rem; margin: 0 0.5rem 0 0; min-width: 180px;text-align: center;} section#GFinal .content__Box .detail .data-box .entry dd{font-size: 1.35rem;} section#GFinal .content__Box .detail .data-box ul.list_dot{list-style: disc; margin: 0 0 0 2.5em;} section#GFinal .content__Box .detail .data-box ul.list_num{list-style: decimal; margin: 0 0 0 2.5em;} section#GFinal .content__Box .detail .data-box ul.table{width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;} section#GFinal .content__Box .detail .data-box ul.table > li{width: 200px; margin: 0; border: 1px solid #999999; text-align: center;} section#GFinal .content__Box .detail .data-box ul.table > li .tb__game{background: #8d8d8d; color: #fff; font-size: 1rem; padding: 0.25rem;} section#GFinal .content__Box .detail .data-box ul.table > li .tb__time{padding: 0.5rem; font-size: 1.15rem;} section#GFinal .content__Box .detail .data-box .team_count{font-size: 1.25rem; font-weight: 600;} section#GFinal .content__Box .detail .data-box .attend table{width: 100%; max-width: 700px;} section#GFinal .content__Box .detail .data-box .attend th, section#GFinal .content__Box .detail .data-box .attend td{padding: 1rem; border: 1px solid #ddd;} section#GFinal .content__Box .detail .data-box .attend th{width: 60%; background: #b81c22; text-align: left; color: #fff;} section#GFinal .content__Box .detail .data-box .attend th span{display: block; font-size: 0.7rem; line-height: 1;} section#GFinal .content__Box .detail .data-box .attend td{text-align: center; font-size: 1.25rem;} section#GFinal .content__Box .detail .data-box .tablebox{width: 100%; max-width: 800px; overflow-x: scroll;} section#GFinal .content__Box .detail .data-box table{width: 100%; border-collapse: collapse;} section#GFinal .content__Box .detail .data-box table th{white-space: nowrap;} section#GFinal .content__Box .detail .data-box table td{border: solid 1px #ddd; white-space: nowrap;} section#GFinal .content__Box .detail .data-box table th{background: #8d8d8d; color: #fff; font-weight: 600; line-height: 1.4; padding: 0.5rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#GFinal .content__Box .detail .data-box table td{vertical-align: middle; padding: 0.5rem 1.0rem; text-align: center;} section#GFinal #GFinal_cont2{background: #1a1a1a; overflow: hidden;} section#GFinal #GFinal_cont2 .content__Catch{display: block; position: relative; padding: 7.1rem 0; z-index: 0;} section#GFinal #GFinal_cont2 .content__Catch:after{content: ''; display: block; width: 100vw; height: 480px; position: absolute; top: 0; left: 0; background-image: url(../img/general/grand/common/one__gf_catch.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: -1;} section#GFinal #GFinal_cont2 .content__Catch h2{width: 100%; max-width: 1240px; margin: 0 auto; color: #fff; line-height: 1.5; text-align: left; } section#GFinal #GFinal_cont2 .content__Catch h2 span{font-size: 4rem; color: #fff; font-weight: inherit; letter-spacing: 0;} section#GFinal #GFinal_cont2 .content__Box .detail{background: none; margin: 0;} section#GFinal #GFinal_cont2 .content__Box .detail h3 .one__logo{width: 100%; max-width: 265px; margin: 0 auto;} section#GFinal #GFinal_cont2 .content__Box .detail h3{text-align: center; font-size: 5.6rem; line-height: 6.6rem;} section#GFinal #GFinal_cont2 .content__Box .detail h3:before{display: none;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .images{width: 100%; max-width: 1120px; margin: 3rem auto;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards{width: 100%; max-width: 900px; background-color: #8f825b; padding: 3rem; margin: 0 auto; position: relative; z-index: 1;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards h4{background: none; color: #fff; font-size: 2.4rem; font-weight: 600; text-align: center; padding: 0; margin-bottom: 1.5rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards:before {content: ""; position: absolute; border: solid 10px #1f1f1f; top: 0px; left: 0px; bottom: 0px; right: 0px; z-index: -1;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards:after {content: ""; position: absolute; border: solid 3px #8f825b; top: -2px; left: -2px; bottom: -2px; right: -2px; z-index: -1;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards p{font-size: 1.4rem; font-weight: 500; color: #fff; text-align: center;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards .movie{position: relative; width: 100%; padding-top: 56.25%; border: 5px solid #c3c3c2; margin-bottom: 1.2rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards .movie iframe {position: absolute; top: 0; right: 0; width: 100%; height: 100%;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards .image{position: relative; width: 100%; border: 5px solid #c3c3c2; margin-bottom: 1.2rem;} section#GFinal #GFinal_cont3{background: #847f6e; overflow: hidden;} section#GFinal #GFinal_cont3 .content__Box .entry h4{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem;} section#GFinal #GFinal_cont3 .content__Box .entry h4:before{content: ''; display: block; background: #d7c072; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#GFinal #GFinal_cont3 .content__Box .entry ul{width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li{margin-right: 2.0rem; width: 30.333%; background-color: #232323; display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; padding: 2rem; margin: 1rem; position: relative; z-index: 1;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li.champion.k, section#GFinal #GFinal_cont3 .content__Box .entry ul > li.champion.t{background-image: linear-gradient(0deg, rgba(35, 35, 35, 1), rgba(225, 21, 21, 1));} section#GFinal #GFinal_cont3 .content__Box .entry ul > li.champion.o{background-image: linear-gradient(0deg, rgba(35, 35, 35, 1), rgba(27, 179, 174, 1));} section#GFinal #GFinal_cont3 .content__Box .entry ul > li:before {content: ""; position: absolute; border: solid 12px #8f825b; top: 0px; left: 0px; bottom: 0px; right: 0px; z-index: -1;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li:after {content: ""; position: absolute; border: solid 5px #eddaa0; top: -2px; left: -2px; bottom: -2px; right: -2px; z-index: -1;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_image{margin-bottom: 0.75rem;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_title{width: 100%; background: #8f825b; font-size: 0.9rem; font-weight: 600; line-height: 1.4; color: #fff; margin-bottom: 0.75rem; padding: 0.25rem 0.25rem 0.5rem; letter-spacing: 1px; text-align: center;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_name{width: 100%;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_name dl{display: flex; justify-content: flex-start; align-items: center;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-logo{padding: 0 1rem 0 0;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-logo .team-image{width: 80px; height: 80px; clip-path: circle(40px at 50% 50%); position: relative;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-logo .team-image img{width: 100%; height: 100%; object-fit: cover;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-info .team-name{width: 100%; display: grid; font-size: 1.5rem; font-weight: 600; color: #fff; overflow: hidden;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-info .team-name p{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-info .shop-name{font-size: 0.6rem; font-weight: 700; color: #999;} section#GFinal #GFinal_cont4{background: #1a1a1a; overflow: hidden;} section#GFinal #GFinal_cont4 .result{margin-bottom: 2.5rem;} section#GFinal #GFinal_cont4 .result .champ{margin-bottom: 3rem;} section#GFinal #GFinal_cont4 .result .runner ul{width: 100%;} section#GFinal #GFinal_cont4 .result .runner ul > li{width: 31.33%; margin-right: 3%;} section#GFinal #GFinal_cont4 .result .runner ul > li:last-child{margin-right: 0;} section#GFinal .wrapper.result{background-color: #fafafa !important; padding: 3rem 0;} section#GFinal .wrapper.result .list{width: 100%; max-width: 1240px; margin: 0 auto;} section#GFinal .wrapper.result .list ul.posts > li{width: 31%; background: #b81d21; margin: 1%; overflow: hidden;} section#GFinal .wrapper.result .list ul.posts > li figure {display: block; width: 100%; height: auto;} section#GFinal .wrapper.result .list ul.posts > li figure img {width: 100%; height: 100%; max-width: 640px;} section#GFinal .wrapper.result .list ul.posts dd {padding: 1rem;} section#GFinal .wrapper.result .list ul.posts dd .game-data {align-items: center;} section#GFinal .wrapper.result .list ul.posts dd .game-data time {display: inline-block; background-color: #90825d; color: #fff; font-size: 0.65rem; line-height: 1; padding: 4px 8px 5px; letter-spacing: 1px; vertical-align: 2px; margin: 0;} section#GFinal .wrapper.result .list ul.posts a .game-title {color: #fff;} section#GFinal .wrapper.result .list ul.posts a:hover .game-title {color: #f5ce5b;} section#GFinal .wrapper.result .list ul.posts dd .game-title {font-size: 1.15rem; font-weight: 600; padding: 0.25rem 0 0;} /*tablet*/ @media (max-width: 1024px) { section#GFinal .inner{padding: 3rem 1.25rem;} section#GFinal .content__Box h3{font-size: 1.4rem; margin-bottom: 1.0rem;} section#GFinal .GFinal__hero:after{content: ''; height: 320px; top: 55px;} section#GFinal .GFinal__Title {padding: 6rem 3rem;} section#GFinal .GFinal-text .inner{width: 100%; padding: 0;} section#GFinal .GFinal-text .inner img{max-width: 320px;} section#GFinal .GFinal__nav{padding: 1.25rem 0.75rem;} section#GFinal .GFinal__nav ul{width: 100dvw; width: 100%;} section#GFinal .GFinal__nav ul > li a:after{width: 15px; clip-path: polygon(0 0, 100% 0, 50% 75%); margin: 3px 0 0 10px;} section#GFinal .GFinal__nav ul > li span{font-size: 1.75rem;} section#GFinal .GFinal__nav ul > li span.nav-text{font-size: 0.95rem;} section#GFinal .content__Box .detail{margin-bottom: 1.5rem;} section#GFinal .content__Box .detail h4{padding: 0.75rem; font-size: 1.1rem;} section#GFinal .content__Box .detail .data-box{padding: 1.0rem;} section#GFinal .content__Box .detail .data-box p.notice{font-size: 1.0rem; line-height: 1.85em;} section#GFinal .content__Box .detail .data-box .entry dl{margin: 0 0 1.0rem; flex-direction: column;} section#GFinal .content__Box .detail .data-box .entry dt{font-size: 0.8rem; padding: 0.35rem 0.5rem 0.5rem; margin: 0 0 0.5rem 0; min-width: 105px;} section#GFinal .content__Box .detail .data-box .entry dd{font-size: 1.1rem;} section#GFinal .content__Box .detail .data-box ul.list_dot{margin: 0 0 0 1.25em;} section#GFinal .content__Box .detail .data-box ul.list_num{margin: 0 0 0 1.25em;} section#GFinal .content__Box .detail .data-box ul.table {flex-direction: column; min-width: 360px;} section#GFinal .content__Box .detail .data-box ul.table > li{width: 100%; margin: 0 0 1rem;} section#GFinal .content__Box .detail .data-box ul.table > li .tb__time{padding: 0.25rem; font-size: 1.0rem;} section#GFinal .content__Box .detail .data-box .team_count{font-size: 1.4rem;} section#GFinal .content__Box .detail .data-box .attend{width: 100%; max-width: 800px; overflow-x: scroll;} section#GFinal .content__Box .detail .data-box .attend table{max-width: none;} section#GFinal .content__Box .detail .data-box .attend th, section#GFinal .content__Box .detail .data-box .attend th{font-size: 0.85rem;} section#GFinal .content__Box .detail .data-box .attend th span{line-height: 1.5;} section#GFinal #GFinal_cont2 .content__Catch{padding: 5.5rem 1.25rem;} section#GFinal #GFinal_cont2 .content__Catch:after{height: 320px;} section#GFinal #GFinal_cont2 .content__Catch h2 span{font-size: 3rem;} section#GFinal #GFinal_cont2 .content__Box .detail h3 .one__logo{max-width: 210px;} section#GFinal #GFinal_cont2 .content__Box .detail h3{font-size: 4.2rem; line-height: 5.5rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards{max-width: 600px; padding: 2rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards h4{font-size: 1.8rem; margin-bottom: 1.25rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards:before {border: solid 7px #1f1f1f;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards p{font-size: 1.15rem;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li{width: 45%; padding: 1.25rem; margin: 1.5% 2.5%;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li:before {border: solid 7px #8f825b;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li:after {border: solid 3px #eddaa0;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_image{margin-bottom: 0.5rem;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_title{font-size: 0.8rem; margin-bottom: 0.5rem; padding: 0.25rem 0.25rem 0.4rem;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-logo{padding: 0 0.5rem 0 0;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-logo .team-image{width: 40px; height: 40px; clip-path: circle(20px at 50% 50%);} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team-info .team-name{font-size: 1.1rem;} section#GFinal #GFinal_cont4 .result{margin-bottom: 1.5rem;} section#GFinal #GFinal_cont4 .result .champ{margin-bottom: 1.5rem;} section#GFinal #GFinal_cont4 .result .runner ul{flex-direction: row;} section#GFinal #GFinal_cont4 .result .runner ul > li:nth-child(1){width: 50%; margin: 0 auto 1.0rem;} section#GFinal #GFinal_cont4 .result .runner ul > li{width: 47%; margin-right: 5%;} section#GFinal #GFinal_cont5 .content__Box .detail .data-box ul{font-size: 0.85rem; margin: 0 0 0 1.75em;} section#GFinal .wrapper.result{padding: 1.5rem 0;} section#GFinal .wrapper.result .list ul.posts{flex-direction: row;} section#GFinal .wrapper.result .list ul.posts > li{width: 100%; min-height: auto; margin: 0 0 1.0rem;} section#GFinal .wrapper.result .list ul.posts dl{display: flex; justify-content: flex-start; align-items: center;} section#GFinal .wrapper.result .list ul.posts dt{width: 30%;} section#GFinal .wrapper.result .list ul.posts dd {width: 70%; padding: 0.5rem;} section#GFinal .wrapper.result .list ul.posts dd .game-data {align-items: flex-start;} section#GFinal .wrapper.result .list ul.posts dd .game-data time {font-size: 0.75rem; padding: 5px;} section#GFinal .wrapper.result .list ul.posts dd .game-title {font-size: 1.0rem; padding: 0.25rem 0 0;} section#GFinal .wrapper.result .list ul.posts > li figure img {width: 100%; height: 100%; max-width: 640px;} } /*smart phone*/ @media (max-width: 767px) { section#GFinal .GFinal__nav ul{width: 95dvw; width: 95%;} section#GFinal .GFinal__nav ul{flex-wrap: wrap;} section#GFinal .GFinal__nav {padding: 0.75rem;} section#GFinal .GFinal__nav ul > li {width: 50%;} section#GFinal .GFinal__nav ul > li span {font-size: 2.4rem;} section#GFinal .GFinal__nav ul > li span.nav-text {font-size: 1.1rem;} section#GFinal #GFinal_cont2 .content__Catch{padding: 6.5rem 1.25rem;} section#GFinal #GFinal_cont2 .content__Catch:after{height: 320px;} section#GFinal #GFinal_cont2 .content__Catch h2 {font-size: 1rem;} section#GFinal #GFinal_cont2 .content__Catch h2 span{font-size: 2.5rem;} } @media (max-width: 430px) { section#GFinal .GFinal__nav ul > li span {font-size: 1.9rem;} section#GFinal .GFinal__nav ul > li span.nav-text {font-size: 0.95rem;} section#GFinal .inner{padding: 1.5rem 1.25rem;} section#GFinal .content__Box .detail .data-box p.notice{font-size: 0.85rem; line-height: 1.6em;} section#GFinal .content__Box .detail .data-box ul.table {min-width: 240px;} section#GFinal .content__Box .detail .data-box .attend{width: 100%; max-width: 800px; overflow-x: scroll;} section#GFinal .content__Box .detail .data-box .attend th, section#GFinal .content__Box .detail .data-box .attend td {padding: 0.5rem;} section#GFinal #GFinal_cont2 .content__Catch{padding: 6.25rem 1.25rem;} section#GFinal #GFinal_cont2 .content__Catch:after {height: 280px;} section#GFinal #GFinal_cont2 .content__Catch h2{font-size: 0.8rem;} section#GFinal #GFinal_cont2 .content__Catch h2 span{font-size: 1.85rem;} section#GFinal #GFinal_cont2 .content__Box .detail h3 .one__logo{max-width: 160px;} section#GFinal #GFinal_cont2 .content__Box .detail h3{font-size: 2.6rem; line-height: 3.4rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards{padding: 1.5rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards h4{font-size: 1.4rem;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards:before {border: solid 5px #1f1f1f;} section#GFinal #GFinal_cont2 .content__Box .detail .flow .rewards p{font-size: 0.8rem;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li{width: 100%; padding: 1.25rem; margin: 1rem 0;} section#GFinal #GFinal_cont3 .content__Box .entry ul > li .team_title{font-size: 1rem;} section#GFinal #GFinal_cont5 .content__Box .detail .data-box ul{line-height: 1.8;} } /*========= Q&A =========*/ section#faq{} section#faq h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 3rem; padding: 0.75rem 0 0; position: relative;} section#faq h3:before{content: ''; display: block; width: 15%; height: 2px; background-color: #b81d21; position: absolute; bottom: -15px; left: 0; margin: auto 0; z-index: 1;} section#faq h3:after{content: ''; display: block; width: 100%; height: 2px; background-color: #c5c5c5; position: absolute; bottom: -15px; left: 0; margin: auto 0;} section#faq h4{font-size: 1.15rem; font-weight: 600; letter-spacing: 1px; position: relative; margin: 0 0 0.75rem; padding: 0 0 0 40px;} section#faq h4:before{content: 'Q'; display: block; position: absolute; top: 0; left: 0; background: #b81d21; border-radius: 200px; height: 32px; width: 32px; padding: 6px; line-height: 1; color: #fff; font-size: 1.0rem; text-align: center;} section#faq .content__Box .sc-tab ul{width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center;} section#faq .content__Box .sc-tab ul > li{width: 32.6555%; margin-right: 1%;} section#faq .content__Box .sc-tab ul > li:last-child{margin-right: 0;} section#faq .content__Box .sc-tab ul > li a{width: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; background: #fff; font-size: 1.2rem; font-weight: 600; text-align: center; color: #b81d21; padding: 0.8rem; border: 1px solid #b81d21; position: relative;} section#faq .content__Box .sc-tab ul > li a:hover{background: #b81d21; color: #fff !important; border: 1px solid #b81d21;} section#faq .content__Box .faq__box{margin: 1.5rem 0;} section#faq .content__Box .faq__box .faq-entry{margin: 2rem 0; position: relative;} section#faq .content__Box .faq__box .faq-entry:after{content: ''; display: block; background: #ccc; width: 100%; height: 1px; line-height: 0; margin: 3rem 0;} section#faq .content__Box .faq__box .faq-entry ul{margin: 1rem 0 0.75rem;} section#faq .content__Box .faq__box .faq-entry ul > li{display: inline-block; color: #b81d21; font-size: 0.75rem; font-weight: 600; line-height: 1; padding: 0.25rem; margin-right: 5px; border: 1px solid #b81d21;} section#faq .content__Box .faq__box .faq-entry dl{position: relative;} section#faq .content__Box .faq__box .faq-entry dt:before{content: 'A'; display: block; position: absolute; top: 0; left: 0; background: #fff; border-radius: 200px; height: 32px; width: 32px; padding: 6px; line-height: 1; font-size: 1.0rem; font-weight: 700; text-align: center; color: #b81d21; border: 1px solid #b81d21;} section#faq .content__Box .faq__box .faq-entry dd{margin: 0 0 0 40px;} section#faq .content__Box .faq__box .faq-entry dd .entry_txt{line-height: 1.85em; letter-spacing: 1px; margin-bottom: 1.5rem;} section#faq .content__Box .faq__box .faq-entry dd .entry_img{width: 100%; max-width: 600px; margin-bottom: 1.5rem;} section#faq .content__Box .faq__box .faq-entry dd .btnArea {max-width: 400px;} section#faq .content__Box .faq__box .faq-entry dd .btnArea a {width: 100%; background: #fff; color: #333; text-align: center; border: 1px solid #333; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0.8rem 2.4rem 0.8rem 0.8rem; position: relative;} section#faq .content__Box .faq__box .faq-entry dd .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} /*tablet*/ @media (max-width: 1024px) { section#faq h3{font-size: 1.4rem; margin-bottom: 1.0rem;} section#faq h3:before{content: ''; height: 1px; bottom: -10px;} section#faq h3:after{content: ''; height: 1px; bottom: -10px;} section#faq h4{font-size: 1.0rem; padding: 0 0 0 30px;} section#faq h4:before{height: 23px; width: 23px; padding: 3px; font-size: 1.0rem;} section#faq .content__Box .sc-tab ul > li a{font-size: 0.8rem; padding: 0.75rem 0.5rem;} section#faq .content__Box .faq__box{margin: 0.75rem 0;} section#faq .content__Box .faq__box .faq-entry{margin: 1.5rem 0;} section#faq .content__Box .faq__box .faq-entry:after{margin: 1.75rem 0;} section#faq .content__Box .faq__box .faq-entry ul{margin: 0.75rem 0; flex-direction: row;} section#faq .content__Box .faq__box .faq-entry ul > li{font-size: 0.7rem; padding: 0.3rem;} section#faq .content__Box .faq__box .faq-entry dt:before{height: 23px; width: 23px; padding: 3px; font-size: 1.0rem;} section#faq .content__Box .faq__box .faq-entry dd{margin: 0 0 0 30px;} section#faq .content__Box .faq__box .faq-entry dd .entry_txt{line-height: 1.6em; margin-bottom: 1.0rem;} section#faq .content__Box .faq__box .faq-entry dd .entry_img{margin-bottom: 1.0rem;} section#faq .content__Box .faq__box .faq-entry dd .btnArea {max-width: 240px;} section#faq .content__Box .faq__box .faq-entry dd .btnArea a {padding: 0.7rem 2.0rem 0.7rem 0.5rem; font-size: 0.8rem;} section#faq .content__Box .faq__box .faq-entry dd .btnArea a:after {content: ''; width: 8px; height: 8px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; right: 12px;} } /*smart phone*/ @media (max-width: 430px) { section#faq .content__Box .sc-tab ul > li a{font-size: 0.6rem; padding: 0.75rem 0.2rem;} } /*========= rule =========*/ section#rule{} section#rule .content__Box .area-inner .rule__box .detail a{color: #333; text-decoration: underline;} section#rule .content__Box .area-inner input[name="tab_blk-switch"] {display: none;} section#rule .content__Box .area-inner input:checked + .blk_label {background-color: #fafafa; border-top: 8px solid #b81d21;} section#rule .content__Box .area-inner input:checked + .blk_label:last-of-type {border-top: 8px solid #1bb3ae;} section#rule .content__Box .area-inner .blk_label{width: 33.06333%; display: inline-block; background: #ededed; font-size: 1.6rem; font-weight: normal; line-height: 1; color: #b81d21; text-align: center; padding: 1.5rem; margin: 0 0 3rem; border-top: 8px solid #454545; cursor: pointer; transition: 0.3s all linear;} section#rule .content__Box .area-inner .blk_label:hover{border-top: 8px solid #b81d21;} section#rule .content__Box .area-inner .blk_label:last-of-type:hover{border-top: 8px solid #1bb3ae;} section#rule .content__Box .area-inner .sc-tab ul{width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center;} section#rule .content__Box .area-inner .sc-tab ul > li{width: 32.6555%; margin-right: 1%;} section#rule .content__Box .area-inner .sc-tab ul > li:last-child{margin-right: 0;} section#rule .content__Box .area-inner .sc-tab ul > li a{width: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; background: #fff; font-size: 1.2rem; font-weight: 600; text-align: center; color: #333; padding: 0.8rem; border: 1px solid #333; position: relative;} section#rule .content__Box .area-inner .sc-tab ul > li a:hover{background: #333; color: #fff !important; border: 1px solid #333;} #tab__blk-01:checked ~ #tab__blk-01_data, #tab__blk-02:checked ~ #tab__blk-02_data, #tab__blk-03:checked ~ #tab__blk-03_data {display: block; opacity: 1; animation: fadeIn .5s;} section#rule .content__Box .area-inner .rule__blk{display: none; margin-top: 1rem; opacity: 0; overflow: hidden; transition: all .2s;} section#rule .content__Box .area-inner .rule__box .entry{margin: 1.5rem 0;} section#rule .content__Box .area-inner .rule__box .entry h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#rule .content__Box .area-inner .rule__box .entry h3:before{content: ''; display: block; background: #333; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#rule .content__Box .area-inner .rule__box .entry p{line-height: 1.85em; letter-spacing: 1px;} section#rule .content__Box .area-inner .rule__box .entry .update{display: block; font-size: 0.95rem; text-align: right; margin: 0.5rem 0;} section#rule .content__Box .area-inner .rule__box .detail{background: #f6f6f6; margin-bottom: 2.5rem;} section#rule .content__Box .area-inner .rule__box .detail h4{background: #efefef; padding: 1.25rem; font-size: 1.35rem; line-height: 1em;} section#rule .content__Box .area-inner .rule__box .detail .data-box{font-size: 1rem; line-height: 1.85em; letter-spacing: 1px; padding: 1.25rem;} section#rule .content__Box .area-inner .rule__box .detail .data-box h5{font-size: 1.05rem; font-weight: 700; line-height: 1.4em; position: relative; height: auto; margin: 0 0 0.75rem; padding: 0 0 0 0.55rem;} section#rule .content__Box .area-inner .rule__box .detail .data-box h5:before{content: ''; display: block; background: #333; width: 2px; height: 80%; position: absolute; top: 3px; left: 0;} section#rule .content__Box .area-inner .rule__box .detail .data-box ol{list-style: decimal; margin: 0 0 0 1.5em;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.list_dot{list-style: disc; margin: 0 0 0 2.5em;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.list_num{list-style: decimal; margin: 0 0 0 2.5em;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col{width: 100%; display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col > li{width: 50%; margin: 0.5rem 0;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col .btnArea{max-width: 430px;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col .btnArea a{width: 100%; background: #fff; color: #333; text-align: center; border: 1px solid #333; text-decoration: none; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0.8rem 2.4rem 0.8rem 0.8rem; position: relative;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#rule .content__Box .area-inner .rule__box .detail .data-box .tablebox{overflow-x: scroll;} section#rule .content__Box .area-inner .rule__box .detail .data-box table{width: 100%; margin: 1rem 0; border-collapse: collapse;} section#rule .content__Box .area-inner .rule__box .detail .data-box table th{white-space: nowrap;} section#rule .content__Box .area-inner .rule__box .detail .data-box table td{border: solid 1px #ddd; white-space: nowrap;} section#rule .content__Box .area-inner .rule__box .detail .data-box table th{background: #efefef; font-weight: 600; line-height: 1.4; padding: 0.5rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#rule .content__Box .area-inner .rule__box .detail .data-box table td{vertical-align: middle; padding: 0.5rem 1.0rem; text-align: center;} /*tablet*/ @media (max-width: 1024px) { section#rule .content__Box .area-inner input:checked + .blk_label {border-top: 5px solid #b81d21;} section#rule .content__Box .area-inner input:checked + .blk_label:last-of-type {border-top: 5px solid #1bb3ae;} section#rule .content__Box .area-inner .blk_label{width: 32.8%; font-size: 0.9rem; padding: 1.0rem 0.75rem; margin: 0 0 0.5rem; border-top: 5px solid #454545;} section#rule .content__Box .area-inner .blk_label:hover{border-top: 5px solid #b81d21;} section#rule .content__Box .area-inner .blk_label:last-of-type:hover{border-top: 5px solid #1bb3ae;} section#rule .content__Box .area-inner .sc-tab ul > li a{font-size: 0.725rem; padding: 0.5rem;} section#rule .content__Box .area-inner .rule__box .entry{margin: 1rem 0;} section#rule .content__Box .area-inner .rule__box .entry h3{font-size: 1.4rem; margin-bottom: 1.0rem;} section#rule .content__Box .area-inner .rule__box .entry h3:before{content: ''; width: 35px;} section#rule .content__Box .area-inner .rule__box .entry p{line-height: 1.85em;} section#rule .content__Box .area-inner .rule__box .entry date{font-size: 0.95rem;} section#rule .content__Box .area-inner .rule__box .detail{margin-bottom: 1.5rem;} section#rule .content__Box .area-inner .rule__box .detail h4{padding: 0.75rem; font-size: 1.1rem;} section#rule .content__Box .area-inner .rule__box .detail .data-box{padding: 1.0rem;} section#rule .content__Box .area-inner .rule__box .detail .data-box ol{margin: 0 0 0 1.5em;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.list_dot{margin: 0 0 0 1.5em;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.list_num{margin: 0 0 0 1.5em;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col > li{width: 100%;} section#rule .content__Box .area-inner .rule__box .detail .data-box ul.col .btnArea{max-width: none;} } /*smart phone*/ @media (max-width: 430px) { section#rule .content__Box .area-inner .blk_label{width: 32.5%; font-size: 0.8rem; padding: 0.8rem 0.25rem;} section#rule .content__Box .area-inner .rule__box .entry date{font-size: 0.85rem;} } /*========= Entry Status =========*/ section#status{} section#status .content__Box .area-inner .status__box .detail a{color: #333; text-decoration: underline;} section#status .content__Box .area-inner input[name="tab_blk-switch"] {display: none;} section#status .content__Box .area-inner input:checked + .blk_label {background-color: #fafafa; border-top: 8px solid #b81d21;} section#status .content__Box .area-inner input:checked + .blk_label:last-of-type {border-top: 8px solid #1bb3ae;} section#status .content__Box .area-inner .blk_label{width: 49.25%; display: inline-block; background: #ededed; font-size: 1.6rem; font-weight: normal; line-height: 1; color: #b81d21; text-align: center; padding: 1.5rem; margin: 0; border-top: 8px solid #454545; cursor: pointer; transition: 0.3s all linear;} section#status .content__Box .area-inner .blk_label:hover{border-top: 8px solid #b81d21;} section#status .content__Box .area-inner .blk_label:last-of-type:hover{border-top: 8px solid #1bb3ae;} #tab__blk-01:checked ~ #tab__blk-01_data, #tab__blk-02:checked ~ #tab__blk-02_data {display: block; opacity: 1; animation: fadeIn .5s;} section#status .content__Box .area-inner .status__blk{display: none; margin-top: 1rem; opacity: 0; overflow: hidden; transition: all .2s;} section#status .content__Box .area-inner .status__box .entry{margin: 1.5rem 0;} section#status .content__Box .area-inner .status__box .entry h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#status .content__Box .area-inner .status__box .entry h3:before{content: ''; display: block; background: #333; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#status .content__Box .area-inner .status__box .entry p{line-height: 1.85em; letter-spacing: 1px;} section#status .content__Box .area-inner .status__box .entry span.update{font-size: 1.25rem; color: #D50000;} section#status .content__Box .area-inner .status__box .detail{background: #f6f6f6; margin-bottom: 2.5rem;} section#status .content__Box .area-inner .status__box .detail .data-box{font-size: 1rem; line-height: 1.85em; letter-spacing: 1px; padding: 1.25rem;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col{width: 100%; display: flex; justify-content: flex-start; align-items: flex-end; flex-wrap: wrap;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col > li{width: 50%; margin: 0.5rem 0;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col .btnArea{max-width: 430px;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col .btnArea a{width: 100%; background: #fff; color: #333; text-align: center; border: 1px solid #333; text-decoration: none; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0.8rem 2.4rem 0.8rem 0.8rem; position: relative;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#status .content__Box .area-inner .status__box .detail .data-box .tablebox{overflow-x: scroll;} section#status .content__Box .area-inner .status__box .detail .data-box table{width: 100%; margin: 1rem 0; border-collapse: collapse;} section#status .content__Box .area-inner .status__box .detail .data-box table th{white-space: nowrap;} section#status .content__Box .area-inner .status__box .detail .data-box table td{border: solid 1px #ddd; white-space: nowrap;} section#status .content__Box .area-inner .status__box .detail .data-box table th{background: #efefef; font-weight: 600; line-height: 1.4; padding: 0.5rem 2.0rem; text-align: center; border: solid 1px #ddd;} section#status .content__Box .area-inner .status__box .detail .data-box table td{vertical-align: middle; padding: 0.5rem 1.0rem; text-align: center;} section#status .content__Box .area-inner .status__box .detail .data-box table td b{color: #388E3C;} section#status .content__Box .area-inner .status__box .detail .data-box table td em{color: #D50000; font-style: normal; font-weight: 700;} /*tablet*/ @media (max-width: 1024px) { section#status .content__Box .area-inner input:checked + .blk_label {border-top: 5px solid #b81d21;} section#status .content__Box .area-inner input:checked + .blk_label:last-of-type {border-top: 5px solid #1bb3ae;} section#status .content__Box .area-inner .blk_label{font-size: 1.0rem; padding: 1.0rem 0.75rem; margin: 0 0 0.5rem; border-top: 5px solid #454545;} section#status .content__Box .area-inner .blk_label:hover{border-top: 5px solid #b81d21;} section#status .content__Box .area-inner .blk_label:last-of-type:hover{border-top: 5px solid #1bb3ae;} section#status .content__Box .area-inner .status__box .entry{margin: 1rem 0;} section#status .content__Box .area-inner .status__box .entry h3{font-size: 1.4rem; margin-bottom: 1.0rem;} section#status .content__Box .area-inner .status__box .entry h3:before{content: ''; width: 35px;} section#status .content__Box .area-inner .status__box .entry p{line-height: 1.85em;} section#status .content__Box .area-inner .status__box .entry span.update{font-size: 0.975rem;} section#status .content__Box .area-inner .status__box .entry date{font-size: 0.95rem;} section#status .content__Box .area-inner .status__box .detail{margin-bottom: 1.5rem;} section#status .content__Box .area-inner .status__box .detail h4{padding: 0.75rem; font-size: 1.1rem;} section#status .content__Box .area-inner .status__box .detail .data-box{padding: 1.0rem;} section#status .content__Box .area-inner .status__box .detail .data-box ol{margin: 0 0 0 1.5em;} section#status .content__Box .area-inner .status__box .detail .data-box ul.list_dot{margin: 0 0 0 1.5em;} section#status .content__Box .area-inner .status__box .detail .data-box ul.list_num{margin: 0 0 0 1.5em;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col > li{width: 100%;} section#status .content__Box .area-inner .status__box .detail .data-box ul.col .btnArea{max-width: none;} } /*smart phone*/ @media (max-width: 430px) { section#status .content__Box .area-inner .blk_label{padding: 0.8rem 0.25rem;} section#status .content__Box .area-inner .status__box .entry date{font-size: 0.85rem;} } /*========= Offer =========*/ section#offer h3{font-size: 1.9rem; font-weight: 700; margin-bottom: 3rem; padding: 0.75rem 0 0; position: relative;} section#offer h3:before{content: ''; display: block; width: 15%; height: 2px; background-color: #b81d21; position: absolute; bottom: -15px; left: 0; margin: auto 0; z-index: 1;} section#offer h3:after{content: ''; display: block; width: 100%; height: 2px; background-color: #c5c5c5; position: absolute; bottom: -15px; left: 0; margin: auto 0;} section#offer .content__Box .subject {background: #f6f6f6; margin-bottom: 2.5rem;} section#offer .content__Box .subject h4{background: #efefef; padding: 1.25rem; font-size: 1.35rem; line-height: 1em;} section#offer .content__Box .subject .data-box{font-size: 1rem; line-height: 1.85em; letter-spacing: 1px; padding: 1.0rem 0.25rem;} section#offer .content__Box .subject .data-box ul.list_dot{list-style: disc; margin: 0 0 0 2.5em;} section#offer .content__Box .flow{margin-bottom: 2.5rem;} section#offer .content__Box .flow ul > li .item-image {border-radius: 15px; overflow: hidden;} section#offer .content__Box .flow ul{display: flex; justify-content: space-between; margin: 1.5rem 0; position: relative;} section#offer .content__Box .flow ul > li{width: 31.33%;} section#offer .content__Box .flow ul > li .item-image{border-radius: 15px; overflow: hidden;} section#offer .content__Box .flow ul > li dt{text-align: center; margin-top: 0.75rem;} section#offer .content__Box .flow ul > li dt p.item-title-text{display: block; font-size: 1.15rem; font-weight: 700;} section#offer .content__Box .flow ul > li dt p.item-title-text span{display: inline-block; background: #249939; color: #fff; padding: 3px 5px 4px; font-size: 0.85rem; border-radius: 3px; margin-right: 0.5rem; vertical-align: 1px;} section#offer .content__Box .flow ul > li dd{margin: 0.75rem 0; font-size: 1rem; line-height: 1.6em;} section#offer .content__Box .example{margin-bottom: 2.5rem;} section#offer .content__Box .example ul > li .item-image {border-radius: 15px; overflow: hidden;} section#offer .content__Box .example ul{display: flex; justify-content: space-between; margin: 1.5rem 0; position: relative;} section#offer .content__Box .example ul > li{width: 48.5%;} section#offer .content__Box .example .tips ul{list-style: disc; margin: 0 0 0 1.65em; justify-content: flex-start; flex-direction: column;} section#offer .content__Box .example .tips ul.list_dot{list-style: disc; margin: 0 0 0 1.65em;} section#offer .content__Box .example .tips ul > li{width: 100%; font-size: 1.0rem; margin: 0 0 0.15rem;} section#offer .content__Box .example .tips h4{font-size: 1.15rem; font-weight: 600; letter-spacing: 1px; position: relative; margin: 0 0 0.75rem; padding: 0 0 0 32px;} section#offer .content__Box .example .tips h4:before{content: '!'; display: block; position: absolute; top: 2px; left: 0; background: #b81d21; border-radius: 200px; height: 26px; width: 26px; padding: 3px; line-height: 1; color: #fff; font-size: 1.15rem; font-weight: 700; text-align: center;} section#offer .content__Box .send dl{border: 1px solid #ddd; padding: 1.5rem;} section#offer .content__Box .send dt{font-size: 1.2rem; font-weight: 600; margin: 0 0 0.5rem; padding: 0 0 0 15px; position: relative;} section#offer .content__Box .send dt:before{content: '・'; display: block; position: absolute; top: -5px; left: -5px; line-height: 1; color: #b81d21; font-size: 2.3rem;} section#offer .content__Box .send dd h4{font-size: 1.4rem;} section#offer .content__Box .send dd p.add{font-size: 2.0rem; font-weight: 700;} section#offer .content__Box .send dd p b{color: #b81d21;} /*tablet*/ @media (max-width: 1024px) { section#offer h3{font-size: 1.4rem; margin-bottom: 2rem; padding: 0;} section#offer h3:before{content: ''; height: 1px; bottom: -10px;} section#offer h3:after{content: ''; height: 1px; bottom: -10px;} section#offer .content__Box .subject {margin-bottom: 2.5rem;} section#offer .content__Box .subject h4{padding: 0.75rem; font-size: 1.2rem;} section#offer .content__Box .subject .data-box{line-height: 1.4em; letter-spacing: 1px; padding: 0.5rem 1rem;} section#offer .content__Box .subject .data-box ul.list_dot{margin: 0 0 0 1.25em;} section#offer .content__Box .flow{margin-bottom: 1.25rem;} section#offer .content__Box .flow ul{flex-direction: column; margin: 1.5rem 0;} section#offer .content__Box .flow ul > li{width: 100%; max-width: 480px; margin: 0 auto 1.25rem;} section#offer .content__Box .flow ul > li dt p.item-title-text{font-size: 1.0rem;} section#offer .content__Box .flow ul > li dt p.item-title-text span{font-size: 0.75rem; margin-right: 0.5rem;} section#offer .content__Box .example{margin-bottom: 2.5rem;} section#offer .content__Box .example ul{flex-direction: column; margin: 1.5rem 0 0.75rem;} section#offer .content__Box .example ul > li{width: 100%; max-width: 480px; margin: 0 auto 1.25rem;} section#offer .content__Box .example .tips ul.list_dot{margin: 0 0 0 1.85em;} section#offer .content__Box .example .tips h4{padding: 0 0 0 26px;} section#offer .content__Box .example .tips h4:before{height: 22px; width: 22px; padding: 2px;} section#offer .content__Box .send dl{padding: 0.75rem;} section#offer .content__Box .send dt:before{top: -3px; left: -3px;} section#offer .content__Box .send dd h4{font-size: 1.1rem;} section#offer .content__Box .send dd p.add{font-size: 1.65rem;} } /*========= Site(Terms) =========*/ section#terms{} section#terms p{font-size: 0.8rem; font-weight: 400; line-height: 1.55em;} section#terms p.intro{margin: 0 0 3rem;} section#terms .entry{width: 100%; margin: 3rem 0;} section#terms .entry h3{font-size: 1.05rem; font-weight: 700; margin-bottom: 0.75rem; padding: 0.75rem 0 0; position: relative;} section#terms .entry h3:before{content: ''; display: block; background: #b81d21; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#terms .entry ul{list-style: disc; margin: 0 0 0 1.5em; font-size: 0.8rem; font-weight: 400; line-height: 1.55em;} section#terms .entry ul > li{margin: 0.4rem 0;} section#terms date{display: block; text-align-last: right;} /*tablet*/ @media (max-width: 1024px) { } /*smart phone*/ @media (max-width: 430px) { } /*========= 404 =========*/ #not-found{height: 90vh; height: 90dvh; display: flex; justify-content: center; align-items: center;} #not-found .not-found__image{width: 22.5%; min-width: 360px; margin: 0 auto;} #not-found h2.not-found__title{font-size: 3.25rem; font-weight: 700; line-height: 3.25rem; letter-spacing: 10px; margin: 1rem 0; text-align: center;} #not-found h2.not-found__title span{display: block; font-size: 1.25rem; line-height: 2.5rem; margin: 0; letter-spacing: 3px;} #not-found p.not-found__desc{text-align: center; font-size: 0.95rem; line-height: 1.55rem; margin: 0 0 30px;} #not-found .btnArea{max-width: 280px; margin: 0 auto;} #not-found .btnArea a{width: 100%; background: #fff; color: #333; border: 1px solid #333; display: flex; align-items: center; justify-content: center; padding: 0.8rem; flex-direction: column; text-align: center; position: relative;} #not-found .btnArea a:hover{border: 1px solid #b81c22;} #not-found .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} #not-found .btnArea a:hover:after{border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} /*tablet*/ @media (max-width: 1024px) { #not-found{height: 87.5vh; height: 87.5dvh; display: flex; justify-content: center; align-items: center;} #not-found .not-found__image{width: 75%; min-width: auto; max-width: 280px;} #not-found h2.not-found__title{font-size: 2.0rem; line-height: 2.0rem; margin: 10px 0;} #not-found h2.not-found__title span{font-size: 0.8rem; margin: 0;} #not-found p.not-found__desc{font-size: 0.75rem; line-height: 1.05rem; margin: 0 0 20px;} } /*smart phone*/ @media (max-width: 430px) { } /*=== Contact ===*/ section#contact{} section#contact .content__Box h3 {font-size: 1.9rem; font-weight: 700; margin-bottom: 1.5rem; padding: 0.75rem 0 0; position: relative;} section#contact .content__Box h3:before {content: ''; display: block; background: #b81d21; width: 70px; height: 1px; position: absolute; top: 0; left: 0;} section#contact .content__Box .contact__Area{width: 100%; align-items: center; border-radius: 15px; background: #efefef; overflow: hidden;} section#contact .content__Box .contact__Area .contact__img{width: 50%;} section#contact .content__Box .contact__Area .contact__txt{width: 50%; padding: 1.5rem;} section#contact .content__Box .contact__Area .contact__txt h3{width: 100%; font-size: 1.25rem; font-weight: 500; line-height: 1.35em; margin-bottom: 0.5rem; padding: 0;} section#contact .content__Box .contact__Area .contact__txt h3:before{display: none;} section#contact .content__Box .contact__Area .contact__txt p{color: initial; font-size: 1.05rem; line-height: 1.4em;} section#contact .content__Box .contact__Area .contact__txt p span{display: block; font-size: 0.7rem;} section#contact .content__Box .contact__Area .contact__txt .btnArea{width: 100%; max-width: 320px; margin: 0 auto;} section#contact .content__Box .contact__Area .contact__txt .btnArea a{width: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; background: #fff; color: #333; font-size: 1.0rem; text-align: center; border: 1px solid #333; border-radius: 0; padding: 0.8rem; position: relative;} section#contact .content__Box .contact__Area .contact__txt .btnArea a:hover {border: 1px solid #b81c22;} section#contact .content__Box .contact__Area .contact__txt .btnArea a:after {content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} section#contact .content__Box .contact__Area .contact__txt .btnArea a:hover:after {border-top: solid 2px #b81c22; border-right: solid 2px #b81c22;} section#contact .content__Box .detail .notice{width: 100%; margin: 0 0 3rem;} section#contact .content__Box .detail .notice ul:first-of-type {font-size: 0.8rem; margin: 0 0 0 5px;} section#contact .content__Box .detail .notice ul{font-size: 0.75rem; margin: 0 0 0 20px;} section#contact .content__Box .detail .notice ul > li {margin: 0 0 0.35rem; list-style: none;} section#contact .content__Box .detail .notice ul:first-of-type li:before {content: "・"; margin-right: 5px;} section#contact .content__Box .detail .notice ul li:before {content: "-"; margin-right: 5px;} section#contact .content__Box .detail .app__agreement{border: 1px solid #dfdfdf; padding: 1.5rem; background: rgba(0, 0, 0, 0.025);} section#contact .content__Box .detail .app__agreement h4{font-size: 1.15rem; font-weight: 500; line-height: 1; text-align: center; margin-bottom: 0.75rem;} section#contact .content__Box .detail .app__agreement ul{list-style: disc; margin: 0 0 0 20px; font-size: 0.8rem;} section#contact .content__Box .detail .app__agreement ul > li{margin-bottom: 0.15rem;} section#contact .content__Box .detail .app__agreement ul > li:last-child{margin-bottom: 0;} section#contact .content__Box .detail .app__agreement a{color: #333; text-decoration: underline;} section#contact .content__Box .detail .consent{margin: 2.5rem 0; text-align: center;} section#contact .content__Box .detail .consent .wpcf7-list-item label{cursor: pointer;} /*tablet*/ @media (max-width: 1024px) { section#contact .content__Box h3 {font-size: 1.4rem; margin-bottom: 1.0rem;} section#contact .content__Box h3:before {content: ''; width: 35px;} section#contact .content__Box .contact__Area{max-width: 520px; margin: 0 auto; border-radius: 10px;} section#contact .content__Box .contact__Area .contact__img{width: 100%;} section#contact .content__Box .contact__Area .contact__txt{width: 100%; padding: 1.25rem;} section#contact .content__Box .contact__Area .contact__txt h3{font-size: 1.0rem; line-height: 1.5em;} section#contact .content__Box .contact__Area .contact__txt p{font-size: 0.9rem; line-height: 1.25em;} section#contact .content__Box .detail .notice{margin: 0 0 1.5rem;} section#contact .content__Box .detail .app__agreement{padding: 1.0rem;} section#contact .content__Box .detail .app__agreement h4{font-size: 1.0rem;} section#contact .content__Box .detail .app__agreement ul{margin: 0 0 0 15px; font-size: 0.75rem;} section#contact .content__Box .detail .app__agreement ul > li{margin-bottom: 0.5rem;} section#contact .content__Box .detail .consent{margin: 2.25rem 0 1.5rem;} } /*smart phone*/ @media (max-width: 430px) {} /* ----------------- form --------------------- */ .wpcf7 .hide {display: none !important;} .wpcf7 .wpcf7-form.init h4, .wpcf7 .wpcf7-form.invalid h4, .wpcf7 .wpcf7-form.submitting h4, .wpcf7 .wpcf7-form.sent h4{font-size: 0.8rem; font-weight: 500; line-height: 1.0em; color: #000;} .wpcf7 .wpcf7-form.init h5, .wpcf7 .wpcf7-form.invalid h5, .wpcf7 .wpcf7-form.submitting h5, .wpcf7 .wpcf7-form.sent h5{width: 100%; font-size: 1.15rem; font-weight: 500; line-height: 1; text-align: left; margin-bottom: 1.25rem; padding: 0 0 0 10px; position: relative;} .wpcf7 .wpcf7-form.init h5:before, .wpcf7 .wpcf7-form.invalid h5:before, .wpcf7 .wpcf7-form.submitting h5:before, .wpcf7 .wpcf7-form.sent h5:before{content: ''; display: block; width: 6px; height: 20px; background: #b81c22; position: absolute; top: 0; left: 0;} .wpcf7 .wpcf7-form.init h6, .wpcf7 .wpcf7-form.invalid h6, .wpcf7 .wpcf7-form.submitting h6, .wpcf7 .wpcf7-form.sent h6{width: calc(100% + 3rem); color: #fff; font-size: 0.85rem; font-weight: 500; line-height: 1; background-color: #423b3b; padding: 0.75rem; margin: -1.5rem -1.5rem 1.5rem;} .wpcf7 .wpcf7-form.init p.tips, .wpcf7 .wpcf7-form.invalid p.tips, .wpcf7 .wpcf7-form.submitting p.tips, .wpcf7 .wpcf7-form.sent p.tips{font-size: 0.75rem; margin: 0.75rem 0 -0.75rem;} .wpcf7 hr{margin: -0.5rem 0 2rem;} .wpcf7 span.must, .wpcf7 span.any{font-size: 0.65rem; line-height: 1; color: #fff; margin: 0 7px 0 0; padding: 3px 8px 4px; vertical-align: 0;} .wpcf7 span.must{background: #b81d21;} .wpcf7 span.any{background: #999;} .wpcf7 input::placeholder{font-size: 0.75rem; opacity: 0.5;} .wpcf7 input.wpcf7-submit {display: inline-block; width: 100%; height: 100%; color: #b81c22; background: none; border: none; line-height: 1; position: absolute; top: 0; left: 0; margin: 0; padding: 0; cursor: pointer;} .wpcf7 input.wpcf7-form-control.wpcf7-text, .wpcf7 textarea.wpcf7-form-control.wpcf7-textarea {width: 100%; padding: 0.75rem; font-size: 0.85rem; line-height: 1.25rem; border: 1px solid #999; border-radius: 5px; margin: 1.25rem 0;} .wpcf7 select.wpcf7-form-control.wpcf7-select{width: 100%; max-width: 240px; padding: 0.75rem; font-size: 0.85rem; line-height: 1.25rem; border: 1px solid #999; border-radius: 5px; margin: 1.25rem 0;} .wpcf7 input[type=checkbox]{position: relative; width: 18px; height: 18px; border: 2px solid #b81c22; vertical-align: -5px; -webkit-appearance: none; -moz-appearance: none; appearance: none;} .wpcf7 input[type=checkbox]:checked:before {content: '';position: absolute; top: 0px; left: 4px; border-right: 2px solid #b81c22; border-bottom: 2px solid #b81c22; transform: rotate(50deg); width: 6px; height: 11px;} .wpcf7 .wpcf7-date {width: 100%; max-width: 300px; padding: 0.75rem; font-size: 0.85rem; line-height: 1.25rem; border: 1px solid #999; border-radius: 5px; margin: 1.25rem 0;} .wpcf7 .wpcf7-textarea {height: 120px;} .wpcf7 .check_accept .wpcf7-form-control-wrap{display: block; margin: 0; padding: 2.0rem 0;} .wpcf7 .check_accept .wpcf7-form-control-wrap span.wpcf7-list-item{margin: 0;} .wpcf7 .check_accept .wpcf7-form-control-wrap span.wpcf7-not-valid-tip{margin: 0.5rem 0 0 !important;} .wpcf7 .btn-submit-wrap{width: 100%; max-width: 280px; display: block; align-items: center; background: #fff; border: 1px solid #b81c22; margin: 0 auto; padding: 1.25rem; position: relative; transition: 0.3s all;} .wpcf7 .btn-submit-wrap:after{content: ''; width: 12px; height: 12px; border: 0; border-top: solid 2px #b81c22; border-right: solid 2px #ae1f1f; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto;} .wpcf7 .btn-submit-wrap:hover {background: #b81c22; color: #fff;} .wpcf7 .btn-submit-wrap:hover:after {border-top: solid 2px #fff; border-right: solid 2px #fff; transition: 0.3s all linear;} .wpcf7 .btn-submit-wrap:hover input.wpcf7-submit {color: #fff; transition: 0.3s all linear;} .wpcf7 .app__detail{margin: 0 0 1.5rem;} .wpcf7 .app__detail .labelBox{margin: 1.25rem 0 1.5rem;} .wpcf7 .app__detail .labelBox span.wpcf7-list-item {margin: 0;} .wpcf7 .app__detail .labelBox label {box-sizing: border-box; cursor: pointer; display: inline-block; padding: 0 0.5rem 0 0; position: relative; width: auto;} .wpcf7 .app__detail .labelBox span.wpcf7-list-item input[type=radio]{accent-color: #b81d21; margin: 0; inline-size: 1.0rem; block-size: 1.0rem;} .wpcf7 .app__detail .labelBox .wpcf7-not-valid-tip {margin: 0.75rem 0 0 !important;} .wpcf7 .app__detail .guestBox, .wpcf7 .app__detail .gameBox{border: 1px solid #eee; padding: 1.5rem; margin: 0 0 1.5rem;} .wpcf7 .app__detail .statsTtl{margin: 1rem 0 2rem;} .wpcf7 .app__detail .statsTtl h6{width: auto; font-size: 0.95rem; color: inherit; background: none; padding: 0 0 0 6px; margin: 0; position: relative;} .wpcf7 .app__detail .statsTtl h6:before{content: ''; display: block; width: 3px; height: 17px; background: #000; position: absolute; top: 0; left: 0;} .wpcf7 .app__detail .statsData, .wpcf7 .app__detail .HaAData{margin: 0 0 1.5rem;} .wpcf7 .app__detail .statsData ul, .wpcf7 .app__detail .HaAData ul{justify-content: space-between;} .wpcf7 .app__detail .statsData ul > li, .wpcf7 .app__detail .HaAData ul > li{width: 49%;} .wpcf7 .app__detail .statsData input.wpcf7-form-control.wpcf7-text, .wpcf7 .app__detail .HaAData input.wpcf7-form-control.wpcf7-text{margin: 1.25rem 0 0;} .wpcf7 .app__detail .statsData span.wpcf7-not-valid-tip, .wpcf7 .app__detail .HaAData span.wpcf7-not-valid-tip{margin: 0.25rem 0 0 !important;} .wpcf7 .wpcf7-response-output {background: #fffff0; border: 1px solid #46b450; color: #28a745; text-align: center !important; margin: 1.25rem 0 0 !important; padding: 1.0rem !important; font-size: 0.85rem;} form.invalid .wpcf7-response-output, form.unaccepted .wpcf7-response-output{color: #dc3232; border: 1px solid #dc3232 !important; background-color: #fff5f6 !important;} .wpcf7-not-valid-tip {font-size: 0.85rem !important; margin: -0.75rem 0 0.75rem !important;} .wpcf7 .ajax-loader {display: block; text-align: center; background-color: #ccc; padding: 0; margin: 15px auto 0;} .wpcf7-spinner {background-color: #b81d21; position: absolute; top: 50%; left: 50%; margin: -12px 0 0 -12px;} .wpcf7 textarea.txa__maintenance{color: #999; background: #efefef;} .wpcf7 textarea.txa__maintenance:focus-visible{outline: none;} /*tablet*/ @media (max-width: 1024px) { .wpcf7 .wpcf7-form.init h4, .wpcf7 .wpcf7-form.invalid h4, .wpcf7 .wpcf7-form.submitting h4, .wpcf7 .wpcf7-form.sent h4{font-size: 1.0rem;} .wpcf7 .wpcf7-form.init h5, .wpcf7 .wpcf7-form.invalid h5, .wpcf7 .wpcf7-form.submitting h5, .wpcf7 .wpcf7-form.sent h5{font-size: 1.0rem; margin-bottom: 1.5rem; padding: 0 0 0 8px;} .wpcf7 .wpcf7-form.init h5:before, .wpcf7 .wpcf7-form.invalid h5:before, .wpcf7 .wpcf7-form.submitting h5:before, .wpcf7 .wpcf7-form.sent h5:before{width: 4px; height: 17px; top: -1px;} .wpcf7 .wpcf7-form.init h6, .wpcf7 .wpcf7-form.invalid h6, .wpcf7 .wpcf7-form.submitting h6, .wpcf7 .wpcf7-form.sent h6{width: calc(100% + 2rem); font-size: 1.0rem; margin: -1.0rem -1.0rem 1.5rem;} .wpcf7 .wpcf7-form.init p.tips, .wpcf7 .wpcf7-form.invalid p.tips, .wpcf7 .wpcf7-form.submitting p.tips, .wpcf7 .wpcf7-form.sent p.tips{margin: 0.75rem 0 -0.75rem;} .wpcf7 hr{margin: -1.0rem 0 1.5rem;} .wpcf7 span.must, .wpcf7 span.any{font-size: 0.75rem; margin: 0 5px 0 0; padding: 2px 10px 4px;} .wpcf7 input::placeholder{font-size: 0.8rem;} .wpcf7 input.wpcf7-form-control.wpcf7-text, .wpcf7 textarea.wpcf7-form-control.wpcf7-textarea {padding: 0.65rem; border-radius: 3px; margin: 1.2rem 0;} .wpcf7 select.wpcf7-form-control.wpcf7-select{max-width: 200px; font-size: 0.85rem; border-radius: 3px;} .wpcf7 input[type=checkbox]{vertical-align: -7px;} .wpcf7 .wpcf7-date {padding: 0.65rem; border-radius: 3px;} .wpcf7 .wpcf7-textarea {height: 135px;} .wpcf7 .check_accept .wpcf7-form-control-wrap{padding: 1.75rem 0 1.25rem;} .wpcf7 .btn-submit-wrap{padding: 1.4rem;} .wpcf7 .app__detail{margin: 0 0 2.5rem;} .wpcf7 .app__detail .guestBox, .wpcf7 .app__detail .gameBox{padding: 1.0rem; margin: 0 0 1.25rem;} .wpcf7 .app__detail .statsTtl{margin: 0 0 2.5rem;} .wpcf7 .app__detail .statsTtl h6{font-size: 0.95rem; padding: 0 0 0 6px; margin: 0;} .wpcf7 .app__detail .statsData, .wpcf7 .app__detail .HaAData{margin: 0 0 0.5rem;} .wpcf7 .app__detail .statsData ul > li, .wpcf7 .app__detail .HaAData ul > li{width: 70%; max-width: 300px; margin: 0;} .wpcf7 .app__detail .statsData ul > li:last-child, .wpcf7 .app__detail .HaAData ul > li:last-child{margin: 1.25rem 0 0;} .wpcf7 .wpcf7-response-output {margin: 1.5rem 0 0 !important;} .wpcf7-not-valid-tip {font-size: 0.75rem !important; margin: -0.55rem 0 1.5rem !important;} } /*smart phone*/ @media (max-width: 430px) { } /*========= Footer =========*/ footer{width: 100%; position: relative; z-index: 1;} footer .footer-partners .partners .card .card-img a:hover, footer .footer-pr a:hover{opacity: 0.8; transition: 0.3s all linear;} footer .grid-container{width: 100%; margin: 0; padding: 0;} footer .grid-row {display: flex; flex-wrap: wrap; justify-content: center; margin: 0;} footer .grid-row > [class*=grid-col] {width: 20.5%; margin-top: 0.5rem; padding: 0 1.5%;} footer .grid-row > [data-col="12"] {width: 24%;} footer .grid-row > [data-col="3"] {width: 12.5%; margin-top: 1.25rem; padding: 0 0.5%;} footer .footer-partners{background: #f0f0f0; padding: 3.0rem 0;} footer .footer-partners .partners{margin: 0 auto; padding: 0.75rem 0;} footer .footer-partners .partners h4{font-size: 1.25rem; font-weight: 700;} footer .footer-partners .partners .card {height: 100%;} footer .footer-partners .partners .card-img {display: flex; flex-direction: column; justify-content: center; min-height: 45px;} footer .footer-partners .partners .card .card-img img {width: 100%; height: auto;} footer .footer-pr{background: #fff;} footer .footer-info{background: #181717; color: #fff; padding: 2.5rem 0;} footer .footer-info .sns-links, footer .footer-info .media-links{width: 100%;} footer .footer-info .sns-links ul, footer .footer-info .media-links ul{width: 100%; display: flex; justify-content: center; align-items: center;} footer .footer-info .sns-links ul > li{width: 3.25%; padding: 0; margin: 0.75rem;} footer .footer-info .sns-links ul > li a .ico_x{fill: #fff;} footer .footer-info .sns-links ul > li a:hover .ico_x{fill: #b81d21; transition: 0.3s all linear;} footer .footer-info .sns-links ul > li a .ico_line{fill: #fff;} footer .footer-info .sns-links ul > li a:hover .ico_line{fill: #06c755; transition: 0.3s all linear;} footer .footer-info .media-links ul > li{font-size: 0.8rem; padding: 0; margin: 0.75rem;} footer .footer-info .media-links ul > li a{color: #fff;} footer .copyright{display: flex; justify-content: center; align-items: center; margin: 15px 0 0;} footer .copyright .site-logo > img {width: 62px;} footer .copyright p {font-size: 0.75rem; font-weight: 300; letter-spacing: 1px; line-height: 1.425em;} footer .copyright p small{font-size: 0.55rem;} footer .scroll-top{width: 100%; max-width: 1240px; margin: 0 auto; position: relative;} footer .scroll-top .inner-scroll-top{position: absolute; top: -64px; right: 5px; font-size: 0.8rem; line-height: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; cursor: pointer;} footer .scroll-top .inner-scroll-top:before{content: ''; width: 22px; height: 22px; border: 0; border-top: solid 3px #fff; border-right: solid 3px #fff; transform: rotate(-45deg); position: absolute; top: 50%; right: 50%; bottom: 50%; margin: -5px -11px 0;} footer .scroll-top .inner-scroll-top:after{content: ''; display: block; background: #b81d21; width: 64px; height: 64px;} /*tablet*/ @media (max-width: 1024px) { footer .grid-row > [class*=grid-col] {width: 100%; max-width: 240px; margin-top: 0.5rem; padding: 0 1.5%;} footer .grid-row > [data-col="12"] {width: 100%; max-width: 275px;} footer .grid-row > [data-col="3"] {width: 33.33%; max-width: 200px; margin-top: 1.0rem; padding: 0;} footer .footer-partners{padding: 1.5rem 0;} footer .footer-partners .partners h4{font-size: 0.9rem;} footer .footer-info{padding: 1.25rem 0;} footer .footer-info .sns-links ul > li{width: 100%; max-width: 42px;} footer .footer-info .media-links ul > li{font-size: 0.7rem; margin: 0.5rem;} footer .copyright .site-logo > img {width: 50px;} footer .copyright p {font-size: 0.6rem; line-height: 1.5em;} footer .scroll-top .inner-scroll-top{top: -48px; right: 0; font-size: 0.5rem;} footer .scroll-top .inner-scroll-top:before{width: 18px; height: 18px; margin: -4px -10px 0;} footer .scroll-top .inner-scroll-top:after{width: 48px; height: 48px;} } /*smart phone*/ @media (max-width: 430px) { footer .grid-row > [class*=grid-col] {max-width: 220px;} footer .grid-row > [data-col="12"] {max-width: 240px;} }