@font-face {font-family: 'KapraNeueMedium'; src: url("/assets/special/rugby_plus_22ss/font/KapraNeueMedium.eot");}
@font-face {font-family: 'KapraNeueMedium'; src: url("/assets/special/rugby_plus_22ss/font/KapraNeueMedium.ttf");}

format("truetype")}
html {height: -webkit-fill-available; overflow-x:hidden; width:100%;}
body {font-family: 'KapraNeueMedium', Arial, 游ゴシック体, YuGothic, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック, "Yu Gothic", sans-serif; min-height: 100vh;  min-height: -webkit-fill-available; background: transparent;}
header img {height:50px; margin:20px 20px 0 ;}
.header-outer-contents {position:fixed; z-index:2;right:0; top:0; padding:27px 24px 0 0; text-align: right; color:#57c3f1;}
.o-header.is-top .o-header_inner {background: rgba(255,255,255,0.8); border-bottom: none;}
a.contact-btn {width: auto; background: #57c3f1; padding: 12px 32px; border-radius: 23px; color: #fff; line-height: 1; display: block; border:2px solid #ffffff; -webkit-transition: .3s ease; transition: .3s ease; font-weight: bold;}
a.contact-btn:hover {color:#57c3f1; background:#fff; border:2px solid #57c3f1; text-decoration: none;}
h1,h2,h3,h4,h5 p {font-family: 'KapraNeueMedium', Arial, 游ゴシック体, YuGothic, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック, "Yu Gothic", sans-serif; }
.a-txt.-lead {font-size: 16px;}
h1 {color:#ffffff;}
h2 {font-size:40px; font-family:'KapraNeueMedium'; color:#000000; padding: 0 32px; text-align:center; margin-top:60px;}
h3 {line-height: 1; margin: 8px 0; font-size:2vw; color: #000000; font-family:'KapraNeueMedium';}

.fv {
  min-height: 100vh; /* カスタムプロパティ未対応ブラウザ用のフォールバック */
  min-height: -webkit-fill-available;
}

.main-visual {background-image:url(/assets/special/rugby_plus_22ss/img/kv-pc.jpg);background-position: center; background-size: cover; -webkit-background-size: cover; background-repeat: no-repeat; width: 100%;}
.main-visual .main-inner {width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align:center; color:#ffffff;}
.main-visual .main-inner img {width:200px;}
.main-visual a {color:#ffffff; font-family:'KapraNeueMedium'; font-size:28px; margin-top:40px; text-decoration:underline; transition: all 1s; }
.main-visual .main-inner a:hover {opacity:0.6;}
.modal_open:hover .clickhere, .modal_open:hover .category-txt {opacity:.6;}
footer {padding: 20px;display: flex; align-items: center;background:#000000;}
footer .footer-inner {width:50%;}
footer .footer-inner p {color:#ffffff; font-size: 12px; margin-bottom: 0;}
footer table a {font-family:'KapraNeueMedium'; font-size:2vw; color:#000000;}
footer table a:hover {color:#000000; text-decoration:none;}
.current {line-height: 2px; width: 24px; background: #000000; margin: 0 auto; margin-bottom:30px}
footer table td {vertical-align: top; text-align: center;padding-right: 24px;}
footer .footer-inner img {width:80px;}
footer .footer-inner img:first-of-type {height: 40px; margin-right: 20px;}
footer .footer-inner:last-of-type {text-align: right;}
.lineup-link {background: #000000; color: #ffffff; padding: 8px; display: block; width:100%; max-width: 400px; text-align: center; font-family: 'KapraNeueMedium'; font-size: 1.5vw; margin: 0 auto; transition: all 1s; position: relative;}
.lineup-link:hover {color:#ffffff; text-decoration:none; opacity:.8;}
.lineup-link:after {content: ''; display: inline-block; width: 50px; height: 36px; opacity:0.8;
    background-image: url(/assets/special/rugby_plus_22ss/img/arrow-right.svg); background-size: contain;
    vertical-align: middle; position: absolute;
    right: 0px;  top: 50%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); background-repeat:no-repeat;}
.o-main {min-width: 100%;padding: 0;}
.o-header_inner {max-width: 100%;}
.is-show .o-header_inner, .o-header_inner:hover {width:100%; max-width: 100%; right: initial; overflow:hidden; background:rgba(255,255,255,0.8);}
.top-main-message {position: absolute; top: 50%; right: 0; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); }
.top-main-message h1 {    font-family: 'KapraNeueMedium'; font-size: 3vw; text-align: center; padding: 32px 72px; color: #fff; margin: 0; line-height: 1.2; font-weight: bold;}
.top-main-message img {width: 15vw; margin: 0 auto; display: block;}
.sub-title {font-size:4rem; letter-spacing: 1px; line-height: 1.5; position:relative; margin: 0 auto 120px; font-weight:bold;}
.sub-title::after {background-color: #57c3f1; bottom: -16px; content: ''; display: block; height: 8px; left: 50%; transform: translate(-50%, 0%); -webkit-transform: translate(-50%, 0%); -ms-transform: translate(-50%, 0%); position: absolute; width: 32px;}
/**.fv{ background-color: transparent; width: 100%; height: 100vh; position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center;}**/
.fv p{ color: #fff; line-height: 2; text-align: center;}
.overlay{ width: 100%; padding-top: 100vh; background: #000000; opacity: 0; position: relative; }
.overlay p{ color: #fff; padding: 0 32px;}

.main-text {padding:240px 0 320px; width: 100vw; position: relative; display: flex; max-width: 1230px; margin: 0 auto;     align-items: center;}
.o-serviceGroup {background:#ffffff;}

.numbers {position:absolute; bottom:0px; right:0px;    text-align: center;}
.numbers p {color:#ffffff;    margin: 0 0 0 18px;}
.numbers h3 {font-size:240px; color:#ffffff;margin-right: -8px;margin-top: -18px; font-family: garamond-premier-pro-caption, serif; font-weight: 500; letter-spacing: -8px;}
.under-numbers {position:absolute; bottom:30px; color:#ffffff; width:100%; display: flex;
  align-items: center;}
.under-numbers:after {content: ''; display: inline-block; width: 100%; opacity:1;
border-top: 1px solid;}
.under-numbers p {font-family: 'KapraNeueMedium'; font-size: 24px; margin:0; width: 200px; margin-left: 20px;}

.a-btnIcon, .a-btnIcon.is-disabled, .a-btnIcon[aria-disabled='true'] {background:#fff;}
.a-btnIcon.-prev svg, .a-btnIcon.-next svg {stroke:#57c3f1; width:21px; height:21px;}

.modal_box {position: fixed; z-index: 7777; display: none; width: 100%; max-width: 100%; height:100vh; overflow-x:hidden; overflow-y:scroll; -ms-overflow-style: none; scrollbar-width: none margin: 0; text-align: center; background: rgba(0,0,0,.9); box-sizing: border-box; top:0!important; left:0!important; color:#fff;}
.modal_box::-webkit-scrollbar {display:none;}
.a-groupPanel {width:100%;}
.modal_open {cursor:pointer; width:100%; position: relative; display: block;}
.modal_open img {width:100%; transition: all 1s;}
.modal_open p.hover-message {transition: all 1s;}
.modal_close {position: fixed; top: 0; right: 27px; display: block; width: 112px; font-size: 46px; color: #000; line-height: 62px; text-align: center; z-index: 10000; width: 48px;}
.modal_close i {line-height: 62px; vertical-align: bottom;}
.modal-wrap {position:relative; width: 100%; height: 100%;}
.modal-inside {width: 100%; max-width: 900px; position: absolute; top: 50%; left:50%; text-align: left; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align:center; padding:80px 0;}
.category-txt {font-family:'KapraNeueMedium'; font-size: 4vw; position:absolute; top:24px; left:24px; margin:0; color:#ffffff; transition: all 1s;}
.modal-inside h3 {font-size:32px; color:#ffffff;margin-bottom: 40px;}
.modal-inside p {font-size: 16px; margin:0; color:#ffffff; line-height:2;font-family: Arial, 游ゴシック体, YuGothic, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック, "Yu Gothic", sans-serif; }
.modal-inside hr {margin:32px 0 24px;}
.modal-inside table {margin-bottom: 48px;}
.modal-inside table td {padding-right:32px}
.modal-inside .moda-titlespace a {font-family: 'KapraNeueMedium'; font-size: 24px; line-height: 1; color: #000000; padding: 12px 0 2px; margin-bottom:4px; transition: 0.75s; display: inline-block; border-bottom: 1px solid #000000; transition: all 1s;}
.modal-inside a:hover {text-decoration:none; opacity:0.6;}
.modal-inside .modal-children table p {font-size:12px;}

.company-wrapper {display:flex;flex-wrap: wrap; justify-content: left;  padding-top: 20px;}
.company-each {margin:0; width:50%; box-sizing: border-box; padding-bottom:20px; overflow: hidden;}
.company-each:nth-of-type(odd) {padding-right: 10px;}
.company-each:nth-of-type(even) {padding-left: 10px;}
.a-btn.-back.-full {text-decoration: none;}

.hover-message {display:none; position:absolute; margin:0;top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); color:#ffffff; z-index: 100;font-family: 'KapraNeueMedium'; font-size: 2vw; }
.modal_open:hover img {filter: brightness(0.5);}
.modal_open:hover .hover-message {display:initial;}
.modal-inside .modal-children:first-of-type img { width: 64px; height: auto; display: block; margin: 8px 0 4px;}

.menu, .menu span { display: inline-block; -webkit-transition: all .4s; transition: all .4s; box-sizing: border-box;}
.menu.active p {color:#ffffff;}
.menu.active span {background-color:#000;}
.menu {position: fixed; top: 16px; right: 16px; width: 64px; height: 64px; z-index: 10; border: none; background: transparent; padding: 0;}
.menu p { text-align: center; margin-top: -32px; font-size: 12px;   position: fixed;}
.menu span { position: absolute; right: 0; width: 100%; height: 2px; background-color: #000; z-index: 10;}
.menu span:nth-of-type(1) { top: 16px; width: 42px; right: 10px;}
.menu span:nth-of-type(2) { bottom: 32px; width: 42px; right: 10px;}
.menu span:nth-of-type(3) { bottom: 18px;  width: 42px; right: 10px;}
.menu.active span:nth-of-type(1) { -webkit-transform: translateY(10px) rotate(45deg); transform: translateY(10px) rotate(45deg);   top: 22px;}
.menu.active span:nth-of-type(3) { -webkit-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); bottom: 30px; width: 42px;}
.menu.active span:nth-of-type(2) {display:none;}


.indivi .modal-inside {width: 90%; margin: 0 auto; max-width: initial; position: initial; top: 0; left: 0; text-align: center; transform: none; -webkit-transform: none; -ms-transform: none; padding: 80px 0; }
.indivi .modal-inside h3, .indivi .modal-inside p {color:#000000; text-align:left; }
.indivi .modal-inside h3 {margin-bottom:0}
.indivi .modal_open {cursor: initial;}
.indivi .modal_open:hover img {filter: none; }
.indivi .modal-inside .to-top {text-align: center; font-size: 32px!important; margin: 160px 0 80px; color: #000000; transition: all 1s; display: block; text-decoration: underline;}
.indivi .modal-inside .to-top:hover {opacity:.7; color:#000000; text-decoration: underline;}

.sp {display:none!important;}
.pc {display:initial!important;}

@media screen and (max-width: 749px) {
.pc {display:none!important;}
.sp {display:initial!important;}
.main-visual {background-image:url(/assets/special/rugby_plus_22ss/img/kv-sp.jpg);}
.main-visual .main-inner {top: 42%;}
.main-visual .main-inner img {width: 120px;}
.modal_open.sp{position: absolute; bottom: 20px; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center;}
.under-numbers { bottom: 12px;}
.under-numbers p {    width: 100%;     max-width: 164px;}
.a-txt.-lead, .modal-inside p {line-height: 2.4; }
h3 {font-size: 32px;}
a.contact-btn {padding: 9px 29px;}
.a-btn.-full {margin:0;}
.header-outer-contents {padding: 10px 10px 0 0;}
h1 {font-size: 6vw; padding: 12px 21px; top: 36%;    margin-top: 4px;}
.numbers h3 { font-size: 180px; margin-right: 0;}
.social-wrap {top: 100px; right: 21px;}
.o-kv.-groupTop .a-scrolldown_txt {color: #fff;}
.o-kv.-groupProject {padding: 0 0 124px;}
.o-kv.-groupProject .a-txt {padding:0 28px; line-height: 2.4;}
.a-txt.-lead.movie-caption {font-size:1.45rem; line-height:2;}
.m-txtContent>:last-child:not(.m-grid.-gallery) {padding-left:28px; padding-right:28px;}
.o-kv.-groupProject:first-of-type {padding-top: 124px;}
.o-serviceGroup_carouselInner {padding: 0;}
.overlay h2, .main-text .a-txt.-lead {text-align:left; padding: 20px;}
.overlay h2 {padding-top:60px;}
.main-text .a-txt.-lead {margin-top:0;}
.moda-titlespace {flex-wrap:wrap;}
.modal_close {top: 18px; right: 18px;}
.modal-inside.modal0 {height:80vh;}
#modal0 .modal-inside {max-width: 100%;}
.modal-inside img {width: 100%;}
.youtube-wrap {margin-top:60px;}
.a-txt.-lead.movie-caption {margin-top: 48px; font-size: 1.5rem;}
.o-serviceGroup {padding-bottom:0;}
.sub-title {margin-bottom:80px;}
.main-text {padding:140px 0; display:block;}
.a-groupPanel {width: 100%;}
.company-wrapper {flex-wrap: wrap; justify-content: center;margin-top: 0;}
.company-each {width: 100%; margin:0;}
.top-main-message img { width: 40vw;}
.top-main-message h1 {font-size: 7vw; line-height: 1.25; padding: 26px 0 0;}
.intro-half {width:100%;}
.category-txt {font-size: 14vw;}
.hover-message {font-size: 8vw;}
h2 {font-size: 9vw;}
.modal-inside {position: initial; transform:none; -webkit-transform:none; -ms-transform:none; margin: 72px auto; max-width: calc(100% - 40px);}
.modal-inside .modal-children, .modal-inside .modal-children:nth-of-type(2) {width:100%; height: auto;}
.modal-inside .modal-children {order: 2; margin: 24px 0 72px;}
.modal-inside .modal-children:nth-of-type(2) {order:1; margin:0;}
.modal-inside .modal-children:nth-of-type(2) img { position: initial; transform: none; -webkit-transform: none; -ms-transform: none;}
.-groupTop {display:none;}
footer {display:block;    padding-top: 0; }
footer .footer-inner {width:100%; padding-top: 72px; margin-top: 0;}
footer table a {font-size: 32px;}
footer .footer-inner:last-of-type {text-align:center;    padding-top: 0;}
footer .footer-inner p {text-align:center;}
footer .footer-inner img{    margin: 0 auto 60px !important; display: block;}
.lineup-link {background: #000000; color: #ffffff; padding: 8px; display: block; width:100%; max-width: 90%; text-align: center; font-family: 'KapraNeueMedium'; font-size: 24px; margin: 0 auto; transition: all 1s; position: relative;}
.modal-inside .lineup-link:hover {color:#ffffff; text-decoration:none; opacity:.8;}
.modal-inside .lineup-link:after {content: ''; display: inline-block; width: 50px; height: 36px; opacity:0.8;
    background-image: url(/assets/special/rugby_plus_22ss/img/arrow-right.svg); background-size: contain;
    vertical-align: middle; position: absolute;
    right: 0px;  top: 50%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); background-repeat:no-repeat;}
.top-main-message {top: 80%; left: 0;}
#nav ul li a h2 {font-size: 48px; }
.click-wrap {top: 120px;}
.clickhere{width: 64px; height: 64px;}
.texts p {font-size: 14px;}
.company-each:nth-of-type(odd) {padding-right: 0px;}
.company-each:nth-of-type(even) {padding-left: 0px;}
.modal-inside table td {display: block;}
}