@charset "UTF-8";
.fade, .top-intro .lead-main, .top-intro .lead-sub, .top-intro .lead-sub:not(.sub), .top-mission .sub2::after, #location .fade, #top-mission-ask .fade { visibility: hidden; opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px); -webkit-transition: opacity 1s ease, -webkit-transform 1s cubic-bezier(0.17, 0.53, 0.43, 0.99); transition: opacity 1s ease, -webkit-transform 1s cubic-bezier(0.17, 0.53, 0.43, 0.99); -o-transition: opacity 1s ease, transform 1s cubic-bezier(0.17, 0.53, 0.43, 0.99); transition: opacity 1s ease, transform 1s cubic-bezier(0.17, 0.53, 0.43, 0.99); transition: opacity 1s ease, transform 1s cubic-bezier(0.17, 0.53, 0.43, 0.99), -webkit-transform 1s cubic-bezier(0.17, 0.53, 0.43, 0.99); }

.t--disp .fade, .fade.t--disp, .top-intro.t--disp .lead-main, .top-intro.t--disp .lead-sub, .top-mission.t--disp .sub2::after, #location.t--disp .fade, #top-mission-ask.t--disp .fade { visibility: visible; opacity: 1; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }

#innovation .delay1, #innovation .delay2, #innovation .delay3, #innovation .delay4, #branding .delay1, #branding .delay2, #branding .delay3, #branding .delay4, #creative .delay1, #creative .delay2, #creative .delay3, #creative .delay4, .top-mission .delay1, .top-mission .delay2, .top-mission .delay3, .top-mission .delay4, .top-mission .delay5, .top-mission .sub2::after, #location .delay1, #location .delay2, #location .delay3, #location .delay4, #location .delay5, #top-mission-ask .delay1, #top-mission-ask .delay2, #top-mission-ask .delay3, #top-mission-ask .delay4, #top-mission-ask .delay5 { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; }

.top-intro .lead-main { -webkit-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; }

.top-intro .lead-sub { -webkit-transition-delay: 0.4s; -o-transition-delay: 0.4s; transition-delay: 0.4s; }

.top-intro .lead-sub:not(.sub), .top-entries .delay1, #service-head .category-header, #service-head .sub, #service-head .sub2, #service-head .btn-more-top { -webkit-transition-delay: 0.5s; -o-transition-delay: 0.5s; transition-delay: 0.5s; }

.top-entries .delay2, #service-types { -webkit-transition-delay: 0.6s; -o-transition-delay: 0.6s; transition-delay: 0.6s; }

.top-entries .delay3, #service-head .btn-more-top2 { -webkit-transition-delay: 0.7s; -o-transition-delay: 0.7s; transition-delay: 0.7s; }

.top-entries .delay4 { -webkit-transition-delay: 0.9s; -o-transition-delay: 0.9s; transition-delay: 0.9s; }

@-webkit-keyframes top_line1 { 0% { height: 0%; }
  10% { height: 100%; }
  10.1% { height: 0%; }
  100% { height: 0%; } }

@keyframes top_line1 { 0% { height: 0%; }
  10% { height: 100%; }
  10.1% { height: 0%; }
  100% { height: 0%; } }

@-webkit-keyframes top_line2 { 0% { height: 0%; }
  10% { height: 0%; }
  10.1% { height: 100%; }
  18% { height: 100%; }
  28% { height: 0%; }
  100% { height: 0%; } }

@keyframes top_line2 { 0% { height: 0%; }
  10% { height: 0%; }
  10.1% { height: 100%; }
  18% { height: 100%; }
  28% { height: 0%; }
  100% { height: 0%; } }

@-webkit-keyframes test_top_line { 0% { height: 0px;
    bottom: 110px; }
  20% { height: 70px;
    bottom: 110px; }
  40% { height: 70px;
    bottom: 40px; }
  60% { height: 0px;
    bottom: 40px; }
  100% { height: 0px;
    bottom: 40px; } }

@keyframes test_top_line { 0% { height: 0px;
    bottom: 110px; }
  20% { height: 70px;
    bottom: 110px; }
  40% { height: 70px;
    bottom: 40px; }
  60% { height: 0px;
    bottom: 40px; }
  100% { height: 0px;
    bottom: 40px; } }

#tubular-container { background-color: #000; }

#tubular-player { opacity: 0; -webkit-transition: opacity 0.5s ease-out; -o-transition: opacity 0.5s ease-out; transition: opacity 0.5s ease-out; }

/* -----------------------------------------------
　HOME
-------------------------------------------------- */
#home .fixed-box:not(.windowFit) { height: auto; }

#home .category-header { font-family: "Ubuntu", sans-serif; font-size: 714.28571%; font-weight: bold; line-height: 1; text-transform: uppercase; text-align: center; }

#home .btn-more-top, #home .btn-more-top2 { font-family: "Ubuntu", sans-serif; font-weight: bold; text-align: center; }

#home .btn-more-top a, #home .btn-more-top2 a { display: inline-block; width: 78px; height: 37px; position: relative; text-align: center; text-transform: uppercase; }

#home .btn-more-top a:hover, #home .btn-more-top2 a:hover { text-decoration: none; opacity: 1; }

#home .btn-more-top span, #home .btn-more-top2 span { display: inline-block; width: 78px; height: 37px; padding: 6px 18px; position: absolute; top: 0; left: 0; }

#home .btn-more-top span.more-clear, #home .btn-more-top2 span.more-clear { color: #fff; }

#home .btn-more-top span.more-black, #home .btn-more-top2 span.more-black { background-color: #000; color: #fff; }

#home .btn-more-top span.more-white, #home .btn-more-top2 span.more-white { background-color: #fff; color: #000; }

#home .btn-more-top span.more-hidden, #home .btn-more-top2 span.more-hidden { overflow: hidden; padding: 0; width: 0 !important; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }

#home .more-top-info.btn-more-top, #home .more-top-info.btn-more-top2 { font-size: 85.71429%; font-weight: bold; }

#home .more-top-info.btn-more-top a, #home .more-top-info.btn-more-top2 a { width: 72px; height: 33px; }

#home .more-top-info.btn-more-top span, #home .more-top-info.btn-more-top2 span { width: 72px; height: 33px; }

#home .btn-more-top a:hover span.more-hidden, #home .btn-more-top.active span.more-hidden { width: 100% !important; }

#home .btn-more-top2 span.more-hidden { -webkit-transition-delay: 1.2s; -o-transition-delay: 1.2s; transition-delay: 1.2s; }

#home .t--disp .btn-more-top2 a:hover span.more-black { background: #808080; }

#home .t--disp .btn-more-top2 span.more-hidden { width: 100% !important; }

#home #effect-layer3 { visibility: visible; z-index: 301; width: 1px; height: 12%; top: auto; bottom: 6%; left: 0; right: 0; margin: 0 auto; }

#home #effect-layer3.anime-play .hamon-line1, #home #effect-layer3.anime-play .hamon-line2 { -webkit-animation-play-state: running; animation-play-state: running; display: block; }

#home #effect-layer3.anime-pause .hamon-line1, #home #effect-layer3.anime-pause .hamon-line2 { -webkit-animation-play-state: paused; animation-play-state: paused; display: none; }

#home #effect-layer3 .hamon-line1, #home #effect-layer3 .hamon-line2 { width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); position: absolute; left: 0; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-play-state: paused; animation-play-state: paused; display: none; -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-delay: 1s; animation-delay: 1s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

#home #effect-layer3 .hamon-line1 { top: 0; bottom: auto; -webkit-animation-name: top_line1; animation-name: top_line1; }

#home #effect-layer3 .hamon-line2 { top: auto; bottom: 0; -webkit-animation-name: top_line2; animation-name: top_line2; }

.skrollr-mobile .home-bgmain, .touch .home-bgmain { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000 url(../../images/home/bg-main_sp.gif) no-repeat center; background-size: cover; z-index: -2; }

@media screen and (max-width: 750px) { .skrollr-desktop .home-bgmain { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000 url(../../images/home/bg-main_sp.gif) no-repeat center; background-size: cover; z-index: -2; } }

.home-bgdot { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2) url(../img/on-dot.png); z-index: -1; }

.no-touch .home-bgdot { background-color: rgba(0, 0, 0, 0.1); }

.top-intro { position: relative; color: #fff; }

.top-intro .fixed-box .fixed-box-inner { position: absolute; bottom: 0; margin: auto; }

.top-intro .top-leader { max-width: 1220px; margin: auto; padding: 0 30px; }

.top-intro .top-leader .header { font-family: "Ubuntu", sans-serif; font-size: 614.28571%; font-weight: bold; line-height: 0.96; text-transform: uppercase; letter-spacing: 2px; }

.top-intro .top-leader p { margin-top: 5px; font-size: 107.14286%; }

.top-intro .top-leader .sub { margin-top: 20px; font-size: 185.71429%; font-weight: bold; }

.top-intro .top-leader .lead-sub:not(.sub) { letter-spacing: 1.4px; }

#home .top-entries .fixed-box-inner { padding: 0; }

.top-entries .fixed-box-inner { position: absolute; bottom: 0; margin: auto; }

.top-entries .fixed-box-container { max-width: 1100px; padding: 0 20px; width: 100%; }

.top-entries .top-entries-l { float: left; width: 62.54717%; color: #fff; }

.top-entries .top-entries-l .box + .box { margin-top: 50px; }

.top-entries .top-entries-l a { color: #fff; display: block; }

.top-entries .top-entries-l a:hover { opacity: 0.5; }

.top-entries .top-entries-l .btn-more-top { position: absolute; top: 0.7em; right: 0; }

.top-entries .top-entries-l .newly { zoom: 1; margin-top: 16px; }

.top-entries .top-entries-l .newly:after { content: ''; display: block; clear: both; overflow: auto; }

.top-entries .top-entries-l .newly .date { float: left; width: 6.5em; }

.top-entries .top-entries-l .newly .lead { display: block; padding: 0 0 10px 0; letter-spacing: 2px; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; }

.top-entries .top-entries-r { float: right; width: 31.41509%; }

.top-entries .top-entries-r .box .box a { display: block; margin-top: 23px; padding: 9.00901%; background-color: rgba(255, 255, 255, 0.8); height: 383px; }

.top-entries .top-entries-r .title { margin-top: 10px; font-size: 114.28571%; font-weight: bold; line-height: 1.5; }

.top-entries .top-entries-r .date { color: #808080; font-size: 100%; margin-top: 16px; }

.top-entries .top-entries-r .header a { color: #fff; display: block; }

.top-entries .top-entries-r .header a:hover { opacity: 0.5; }

.top-entries .top-entries-r a:hover .title { color: #808080; }

.top-entries .top-entries-r a:hover .date { color: #c0c0c0; }

.top-entries .top-entries-r .swiper-pagination-bullet { width: 13px; height: 13px; margin: 0 13px; }

.top-entries .top-entries-r .swiper-container-horizontal > .swiper-pagination { bottom: 20px; }

.top-entries .header { color: #fff; font-weight: bold; line-height: 1; }

.top-entries .header:not(.jp) { font-family: "Ubuntu", sans-serif; font-size: 214.28571%; text-transform: uppercase; }

.top-entries .header.jp { font-size: 185.71429%; }

.top-entries .sub { line-height: 1.857; letter-spacing: 2px; margin: 15px 0; }

.top-entries .box { position: relative; }

.top-entries .layer3 { position: absolute; visibility: hidden; z-index: 301; width: 1px; left: 0; right: 0; margin: auto; top: 88%; height: 0; background: #c8c8c8; -webkit-animation-name: top_line2; animation-name: top_line2; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-play-state: running; animation-play-state: running; display: block; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-delay: 3s; animation-delay: 3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.top-entries .layer3.anime-play { -webkit-animation-play-state: running; animation-play-state: running; display: block; }

.top-entries .layer3.anime-pause { -webkit-animation-play-state: paused; animation-play-state: paused; display: none; }

.top-service { padding: 0; }

.top-service > .fixed-box { background: #fff; }

.top-service > .fixed-box .layer3 { position: absolute; visibility: visible; z-index: 301; width: 1px; left: 0; right: 0; margin: auto; top: 88%; background: black; -webkit-animation-name: top_line2; animation-name: top_line2; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-play-state: running; animation-play-state: running; display: block; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.top-service > .fixed-box .layer3.anime-play { -webkit-animation-play-state: running; animation-play-state: running; display: block; }

.top-service > .fixed-box .layer3.anime-pause { -webkit-animation-play-state: paused; animation-play-state: paused; display: none; }

.top-service > .fixed-box > .fixed-box-inner { bottom: auto; padding: 100px 0 0; }

@media screen and (max-width: 750px) { .top-service > .fixed-box > .fixed-box-inner { padding-top: 55px; } }

.top-service .service-head { padding: 0 30px; }

.top-service .category-header + .sub { margin: 0.5em 0 0.3em; font-size: 214.28571%; font-weight: bold; line-height: 1.4; text-align: center; }

.top-service .sub2 { margin: 0 0 40px; text-align: center; line-height: 1.875; font-size: 114.28571%; }

.top-service .service-types { padding-top: 45px; padding-bottom: 100px; }

.top-service .service-types2 { padding-top: 50px; padding-bottom: 120px; }

.top-service.t--scrollend #sec-service-detail .layer { width: 0%; }

.top-service #sec-service-detail > div > .disp-listener { position: static; }

.top-service #sec-service-detail .fixed-box { width: 100%; position: absolute; }

.top-service #sec-service-detail .fixed-box:not(.-fixed) { top: 0 !important; }

.top-service #sec-service-detail .fixed-box .fixed-box-inner { z-index: 3; }

.top-service #sec-service-detail .fixed-box.-fixed .fixed-box-inner { position: fixed; }

.top-service #sec-service-detail .fixed-box.-bottom { position: absolute; bottom: 0; height: auto !important; }

.top-service #sec-service-detail .fixed-box.-bottom .fixed-box-inner { position: absolute; top: auto !important; bottom: 0; height: auto !important; }

.top-service #sec-service-detail .fixed-box.-bottom .fixed-box-container { height: auto !important; }

.top-service #sec-service-detail .layer { background: #fff; width: 51%; width: 0%; height: 100%; position: absolute; z-index: 2; -webkit-transition: width 0.5s ease; -o-transition: width 0.5s ease; transition: width 0.5s ease; }

@media screen and (max-width: 750px) { .top-service #sec-service-detail .layer { width: 0; } }

.top-service #sec-service-detail .layer.t--disp { width: 0%; }

.top-service #sec-service-detail .layer1 { left: 0; }

.top-service #sec-service-detail .layer2 { right: 0; }

.top-service #sec-service-detail .layer3 { position: absolute; visibility: hidden; z-index: 3; width: 1px; left: 0; right: 0; margin: auto; top: 88%; background: black; -webkit-animation-name: top_line2; animation-name: top_line2; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-play-state: running; animation-play-state: running; display: block; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.top-service #sec-service-detail .layer3.anime-play { -webkit-animation-play-state: running; animation-play-state: running; display: block; }

.top-service #sec-service-detail .layer3.anime-pause { -webkit-animation-play-state: paused; animation-play-state: paused; display: none; }

.top-service .service-info1 { position: relative; padding: 40px 20px; }

.top-service .service-info1 .wrap-box { max-width: 1206px; margin: 0 auto; }

.top-service .service-info1 .box { width: 620px; padding: 50px; background-color: #fff; }

.top-service .service-info1 .intro-sub { font-size: 142.85714%; font-weight: bold; }

.top-service .service-info1 .intro-sub2 { position: relative; margin: 20px 0 35px; }

.top-service .service-info1 .intro-sub2:before { display: inline-block; position: absolute; bottom: -18px; left: 0; width: 20px; height: 1px; background-color: #000; font-size: 0; content: ""; }

.top-service .service-info1 .title { font-family: "Ubuntu Condensed", sans-serif; font-size: 471.42857%; line-height: 1; text-transform: uppercase; }

.top-service .service-info1 ul li { display: inline-block; margin-bottom: 4px; }

.top-service .service-info1 ul li:nth-child(odd) { padding-right: 1em; }

.top-service .service-info1 .sw { display: none; }

.top-service .img-sp, .top-service .img-static { display: none; }

.top-service .service-info1_2 { position: relative; padding: 130px 20px; }

.top-service .service-info1_2 .box { color: #fff; text-align: center; }

.top-service .service-info1_2 .intro-sub { font-size: 171.42857%; color: #fff; }

.top-service .service-info1_2 .intro-sub2 { position: relative; margin: 18px 0 32px; font-size: 114.28571%; line-height: 1.875; }

.top-service .service-info1_2 .intro-sub2:before { display: inline-block; position: absolute; bottom: -14px; left: 0; right: 0; margin: 0 auto; width: 20px; height: 1px; background-color: #fff; font-size: 0; content: ""; }

.top-service .service-info1_2 .title-box a { display: inline-block; }

.top-service .service-info1_2 .title { font-family: "Work Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, "游ゴシック", "游ゴシック体", "YuGothic", "Yu Gothic", Helvetica, sans-serif; font-size: 571.42857%; line-height: 1; text-transform: uppercase; color: #fff; padding: 10px 0; }

.top-service .service-info1_2 ul { max-width: 600px; margin: 0 auto; }

.top-service .service-info1_2 ul li { display: inline-block; margin-bottom: 4px; font-size: 114.28571%; line-height: 1.875; }

.top-service .service-info1_2 ul li:nth-child(odd) { padding-right: 1em; }

.top-service .service-info1_2 .sw { display: none; }

.top-service .service-info2 { position: relative; width: 100%; padding: 30px 0; overflow: hidden; }

.top-service .service-info2 .swiper-container-horizontal > .swiper-pagination .swiper-pagination-bullet { margin: 0 13px; }

.top-service .service-info2 .swiper-pagination-bullet { width: 13px; height: 13px; }

.top-service .service-info2 .control li { position: absolute; top: 0; height: 100%; }

.top-service .service-info2 .control li span { display: block; position: relative; z-index: 10; height: 100%; background-color: rgba(0, 0, 0, 0.7); color: #fff; text-indent: -9999px; opacity: 0; -webkit-transition: opacity 2s ease; -o-transition: opacity 2s ease; transition: opacity 2s ease; }

.top-service .service-info2 .control li span.active { opacity: 1; }

.top-service .service-info2 .control li span:after { position: absolute; top: 50%; width: 18px; height: 18px; margin: -10px 0 0 0; content: ""; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }

.top-service .service-info2 .control li.prev { left: 0; width: 100px; }

.top-service .service-info2 .control li.prev span:after { left: 30px; border-bottom: 2px solid #fff; border-left: 2px solid #fff; }

.top-service .service-info2 .control li.next { right: 0; width: 100px; }

.top-service .service-info2 .control li.next span:after { right: 30px; border-top: 2px solid #fff; border-right: 2px solid #fff; }

.top-service .service-info2 .wrap-service-slide { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; -webkit-transition: -webkit-transform 2s ease-out; transition: -webkit-transform 2s ease-out; -o-transition: transform 2s ease-out; transition: transform 2s ease-out; transition: transform 2s ease-out, -webkit-transform 2s ease-out; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }

.top-service .service-info2 .header { color: #fff; font-family: "Work Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, "游ゴシック", "游ゴシック体", "YuGothic", "Yu Gothic", Helvetica, sans-serif; font-size: 214.28571%; line-height: 1; text-transform: uppercase; position: relative; width: 246px; }

.top-service .service-info2 .header span, .top-service .service-info2 .header a { display: block; width: 100%; color: #fff; text-align: center; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

.top-service .service-info2 .header a:hover { opacity: 0.8; }

.top-service .service-info2 .info-contents { zoom: 1; }

.top-service .service-info2 .info-contents:after { content: ''; display: block; clear: both; overflow: auto; }

.top-service .service-info2 .info-contents li { float: left; width: 620px; max-width: 750px; padding-right: 20px; }

.top-service .service-info2 .info-contents li:last-child { padding-right: 0; }

.top-service .service-info2 .info-contents li a { display: table; width: 100%; height: 100%; padding: 20px; background-color: #fff; }

.top-service .service-info2 .img { display: table-cell; width: 296px; vertical-align: middle; }

.top-service .service-info2 .img img { width: 100%; }

.top-service .service-info2 .text { display: table-cell; vertical-align: middle; padding-left: 20px; }

.top-service .service-info2 .title { margin: 0 0 5px; font-size: 128.57143%; font-weight: bold; }

.top-service .service-info2 .pad_right-20 { padding-right: 20px; }

.top-service .service-innovation { background: no-repeat center; background-size: cover; background-attachment: fixed; background-image: url(../../images/home/bg-service-innovation.jpg); }

.top-service .service-innovation .service-info2 { background-color: #965AD2; }

.top-service .service-innovation .service-info2 .slide1 { width: 750px; }

.top-service .service-branding { background: no-repeat center; background-size: cover; background-attachment: fixed; background-image: url(../../images/home/bg-service-branding.jpg); }

.top-service .service-branding .service-info2 { background-color: #A89624; }

.top-service .service-branding .service-info2 .slide1 { width: 1091px; max-width: none; }

.top-service .service-branding .service-info2 .slide1 a { padding: 40px; }

.top-service .service-branding .service-info2 .slide1 .img { width: 600px; }

.top-service .service-branding .service-info2 .slide1 .img img { max-width: 580px; }

.top-service .service-creative { background: no-repeat center; background-size: cover; background-attachment: fixed; background-image: url(../../images/home/bg-service-creative.jpg); }

.top-service .service-creative .service-info2 { background-color: #1BAE8C; }

.top-service .service-info1, .top-service .service-info2, .top-service .service-info1_2 { z-index: 2; }

.top-service .service-innovation, .top-service .service-branding, .top-service .service-creative { position: relative; }

.top-service .service-innovation:after, .top-service .service-branding:after, .top-service .service-creative:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); }

.top-service .service-innovation.t--disp:after, .top-service .service-branding.t--disp:after, .top-service .service-creative.t--disp:after { opacity: 1; visibility: visible; }

.top-mission { padding-left: 0 !important; padding-right: 0 !important; }

.top-mission .fixed-box-container { padding: 0 20px; }

.top-mission .category-header + .sub { margin: 0.5em 0 0.65em; font-size: 285.71429%; font-weight: bold; line-height: 1.4; }

.top-mission .sub2 { display: block; padding: 0 10px 80px; margin-bottom: 0; position: relative; font-size: 114.28571%; line-height: 1.875; }

.top-mission .location-sub { font-size: 185.71429%; font-weight: bold; }

.top-mission .top-mission-location { max-width: 956px; margin: 30px auto 60px; }

.top-mission .top-mission-location ul { margin: 0 -3px; }

.top-mission .top-mission-location li { float: left; width: 50%; padding: 0 3px; }

.top-mission .top-mission-ask { padding-top: 100px; }

.top-recruit { position: relative; padding-top: 33.675%; background: #000 url(../../images/home/bg-recruit.jpg) no-repeat center 0; background-size: cover; color: #fff; text-align: center; }

.top-recruit:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.55); content: ""; z-index: 0; }

.top-recruit .box { position: static; margin: auto; top: 0; bottom: 0; left: 0; right: 0; }

.top-recruit .sub { margin: 0.2em 0 0; font-size: 185.71429%; font-weight: bold; }

.top-recruit .sub2 { margin: 0.3em 0 30px; }

.top-recruit .sw { display: none; }

.top-recruit .btn-more a { background-color: #fff; color: #000; font-weight: bold; }

@media screen and (max-width: 900px) { .top-recruit { padding-top: 45px; }
  .top-recruit .box { position: static !important; }
  .top-recruit .sub { margin: 0.4em 0 0; font-size: 133.33333%; } }

@media screen and (max-width: 900px) { .top-intro .top-leader .header { font-size: 506.66667%; }
  .top-intro .top-leader .sub { font-size: 160%; } }

@media screen and (max-width: 900px) { .top-mission .sub + .sub2 { text-align: left; font-size: 100%; line-height: 1.8; } }

@media screen and (max-width: 768px) { .fade { opacity: 1; visibility: visible; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }
  #home .category-header { font-size: 366.66667%; }
  #home .btn-more-top { margin: 0 auto; font-size: 80%; }
  #home .btn-more-top.sw { margin-top: 20px; }
  #home .btn-more-top a, #home .btn-more-top.more-top-info a { width: 180px; height: 47px; }
  #home .btn-more-top span, #home .btn-more-top.more-top-info span { width: 180px; height: 47px; padding: 14px 18px; }
  #home .btn-more-top span.more-hidden, #home .btn-more-top.more-top-info span.more-hidden { padding: 0 !important; }
  #home .btn-more-top.more-top-info span.more-hidden { width: 100% !important; }
  .top-intro { margin-top: 0px; }
  .top-intro .top-leader { padding: 0 20px; text-align: center; }
  .top-intro .top-leader .header { font-size: 213.33333%; line-height: 1.1; letter-spacing: 1.4px; }
  .top-intro .top-leader p { margin-top: 10px; font-size: 100%; text-align: left; }
  .top-intro .top-leader p br { display: none; }
  .top-intro .top-leader .sub { margin-top: 16px; font-size: 133.33333%; text-align: center; line-height: 1.3; }
  .top-intro .top-leader .lead-sub:not(.sub) { padding: 0 15px; letter-spacing: normal; }
  .top-entries { background-image: -webkit-linear-gradient(top, transparent 0%, black 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black)); background-image: -o-linear-gradient(top, transparent 0%, black 100%); background-image: linear-gradient(180deg, transparent 0%, black 100%); }
  .top-entries .top-entries-l { padding-top: 80px; float: none; width: auto; }
  .top-entries .top-entries-l .box { padding: 30px 10px; }
  .top-entries .top-entries-l .box + .box { margin-top: 45px; }
  .top-entries .top-entries-l .btn-more-top { position: static; }
  .top-entries .top-entries-l .newly { margin: 22px 0 25px; border-top: 1px solid #fff; }
  .top-entries .top-entries-l .newly li { position: relative; padding: 17px 20px 17px 0; border-bottom: 1px solid #fff; }
  .top-entries .top-entries-l .newly li:after { position: absolute; top: 50%; right: -6px; margin-top: -0.75em; font-size: 160%; font-family: "icomoon"; content: "\e900"; }
  .top-entries .top-entries-l .newly .date { float: none; padding: 0; font-size: 86.66667%; }
  .top-entries .top-entries-l .newly .lead { padding: 0; letter-spacing: normal; }
  .top-entries .top-entries-r { float: none; width: auto; max-width: 335px; margin: 0 auto; padding: 45px 0 45px; }
  .top-entries .top-entries-r .box .box a { margin: 22px 0 0; padding: 30px; background-color: white; }
  .top-entries .top-entries-r .title { font-size: 113.33333%; }
  .top-entries .top-entries-r .date { font-size: 100%; }
  .top-entries .header { text-align: center; }
  .top-entries .header:not(.jp) { font-size: 200%; }
  .top-entries .header.jp { font-size: 166.66667%; }
  .top-entries .sub { letter-spacing: normal; }
  .top-service { /*.service-info2 { display: block; padding: 20px; .control { display: none; } .wrap-service-slide { display: block; width: auto; } .header { padding: 0 0 0.6em 0.3em; @include fontSize(25,15); span,a { display: block; width: auto; } } .info-contents { width: auto; li { width: 100%; padding-right: 0; } } .title { @include fontSize(17,15); } }*/ }
  .top-service .service-head { padding: 0 30px; }
  .top-service .category-header + .sub { margin: 0.8em 0 0.4em; font-size: 133.33333%; }
  .top-service .sub2 { margin: 0 0 20px; text-align: left; font-size: 100%; }
  .top-service .sub2 br { display: none; }
  .top-service .service-types { padding-top: 20px; padding-bottom: 20px; }
  .top-service .service-info1 { padding: 30px 20px; }
  .top-service .service-info1 .box { width: 70%; padding: 30px; }
  .top-service .service-info1 .intro-sub { font-size: 113.33333%; }
  .top-service .service-info1 .intro-sub2 { margin: 10px 0 30px; }
  .top-service .service-info1 .intro-sub2:before { width: 100%; height: 1px; background-color: #808080; }
  .top-service .service-info1 .title { font-size: 333.33333%; }
  .top-service .service-innovation { background-image: none; background-color: #fff; }
  .top-service .service-branding { background-image: none; background-color: #fff; }
  .top-service .service-creative { background-image: none; background-color: #fff; }
  .top-mission { padding-bottom: 40px; }
  .top-mission .fixed-box-container { padding-top: 20px; }
  .top-mission .category-header + .sub { margin: 15px 0 6px; font-size: 186.66667%; }
  .top-mission .sub + .sub2 { padding: 0 10px 45px; }
  .top-mission .location-sub { font-size: 113.33333%; }
  .top-mission .top-mission-location { margin: 13px auto 20px; }
  .top-mission .top-mission-location ul { margin: 0 -1px; }
  .top-mission .top-mission-location li { padding: 0 1px; }
  .top-mission .top-mission-ask { padding-top: 40px; }
  .top-mission .ask-sub2 { padding: 0 10px; }
  .top-recruit { padding: 40px 0; }
  .top-recruit .box { position: static !important; }
  .top-recruit .sub { margin: 0.4em 0 0; font-size: 133.33333%; } }

@media screen and (max-width: 750px) { .top-service .service-types2 { padding: 50px 20px 20px; } }

@media screen and (max-width: 768px) { .effect-layer-inner { display: none; }
  .top-service .service-info1 { padding: 52.66667% 0 0; background: #ccc !important; }
  .top-service .service-info1 .box { width: auto; }
  .top-service .service-info1 .sw { display: block; margin-top: 20px; }
  .top-service .service-info1_2 { padding: 0; background: #ccc !important; }
  .top-service .service-info1_2 .box, .top-service .service-info1_2 .title, .top-service .service-info1_2 .intro-sub { color: #000; }
  .top-service .service-info1_2 .box { padding: 38px 30px; background-color: #fff; text-align: left; }
  .top-service .service-info1_2 .title-box { text-align: center; }
  .top-service .service-info1_2 .title { font-size: 300%; }
  .top-service .service-info1_2 .intro-sub { font-size: 113.33333%; }
  .top-service .service-info1_2 .intro-sub2 { margin: 14px 0 40px; font-size: 100%; line-height: 1.666; }
  .top-service .service-info1_2 .intro-sub2:before { width: 100%; height: 1px; background-color: #808080; }
  .top-service .service-info1_2 ul li { display: block; font-size: 100%; line-height: 1.666; margin-bottom: 0; }
  .top-service .service-info1_2 ul li:nth-child(odd) { padding-right: 0; }
  .top-service .service-info1_2 .sw { display: block; margin-top: 26px !important; }
  .top-service .img-static { display: block; padding-top: 52.66667%; }
  .top-service .img-sp { -webkit-transition: padding 0.2s ease-out; -o-transition: padding 0.2s ease-out; transition: padding 0.2s ease-out; display: block; /*position: absolute; position: fixed;*/ top: 0; z-index: 10; padding: 52.66667% 0 0; background: no-repeat center; background-size: 125%; position: relative; }
  .top-service .img-sp .text { opacity: 0; position: absolute; top: 50%; z-index: 12; width: 100%; color: #fff; line-height: 1; text-align: center; -webkit-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
  .top-service .img-sp .text span { width: 100%; }
  .top-service .img-sp .text .ja { font-size: 80%; margin-bottom: 9px; }
  .top-service .img-sp .text .en { font-family: "Work Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, "游ゴシック", "游ゴシック体", "YuGothic", "Yu Gothic", Helvetica, sans-serif; font-size: 233.33333%; }
  .top-service .img-sp.disp-text .text { opacity: 1; }
  .top-service .img-sp:before { display: block; content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 11; background: #000; opacity: 0; visibility: hidden; -webkit-transition: opacity 0.2s ease-out; -o-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; }
  .top-service .img-sp.slim { padding: 26.66667% 0 0; }
  .top-service .img-sp.slim:before { opacity: 0.4; visibility: visible; }
  .top-service .service-innovation .img-sp { background-image: url(../../images/home/img-service-innovation_sp.jpg); }
  .top-service .service-branding .img-sp { background-image: url(../../images/home/img-service-branding_sp.jpg); }
  .top-service .service-creative .img-sp { background-image: url(../../images/home/img-service-creative_sp.jpg); }
  .top-service .service-info2 { padding: 20px; }
  .top-service .service-info2 .control { display: none; }
  .top-service .service-info2 .wrap-service-slide { display: block; width: auto; }
  .top-service .service-info2 .header { padding: 0 0 0.6em 0.3em; font-size: 166.66667%; width: auto; }
  .top-service .service-info2 .header span, .top-service .service-info2 .header a { display: block; width: auto; position: static; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
  .top-service .service-info2 .info-contents { width: auto; }
  .top-service .service-info2 .info-contents li { width: 100%; padding-right: 0; }
  .top-service .service-info2 .info-contents li a { display: block; padding: 30px 30px 50px; } }

@media screen and (max-width: 768px) and (max-width: 375px) { .top-service .service-info2 .info-contents li a { min-height: 365px; } }

@media screen and (max-width: 768px) { .top-service .service-info2 .img { display: block; width: auto; text-align: center; }
  .top-service .service-info2 .title { font-size: 113.33333%; }
  .top-service .service-info2 .text { display: block; margin-top: 15px; padding-left: 0; overflow: hidden; }
  .top-service .service-info2 .pad_right-20 { padding-right: 0; }
  .top-service .service-branding .service-info2 .img { width: auto; }
  .top-service .service-branding .service-info2 .img img { max-width: 100%; }
  .top-service .service-innovation:after, .top-service .service-branding:after, .top-service .service-creative:after { display: none; }
  .top-recruit { background: #F2F2F2; color: #000; }
  .top-recruit:before { display: none; }
  .top-recruit .sub2 { display: inline-block; margin: 0.4em 30px 20px; text-align: left; }
  .top-recruit .sub2 br { display: none; }
  .top-recruit .sw { display: block; margin-bottom: 25px; }
  #home .top-recruit .btn-more-top span.more-black { background-color: transparent; color: #000; font-weight: bold; }
  #home .top-recruit .btn-more-top span.more-white { background-color: #000; color: #fff; font-weight: normal; }
  #home .top-recruit .btn-more-top a:hover span.more-white { background-color: #808080 !important; } }

/* -----------------------------------------------
　アニメーション
-------------------------------------------------- */
#service-types { -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); }

#service-types.t--disp { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }

@media screen and (max-width: 750px) { #service-types.fade, #location .fade { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; visibility: visible; opacity: 1; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); } }

/* -----------------------------------------------
　デバッグ用
-------------------------------------------------- */
.disp-listener { position: relative; }

.debug #debug { background: yellow; color: #000; padding: 0 3px; position: fixed; z-index: 999; }

.debug #debug2 { background: yellow; color: #000; padding: 0 3px; position: fixed; z-index: 1000; right: 0; }

.debug #site-header { opacity: 0.8; }

.debug .disp-listener { border: solid 1px cyan; }

.debug .listener-id { background: cyan; color: #fff; padding: 0 3px; position: absolute; z-index: 999; left: 0; top: 20px; }

.debug .t--disp .listener-id { background: orange; }

.debug .listener-id2 { background: navy; color: #fff; padding: 0 3px; position: absolute; z-index: 999; left: 0; top: 40px; }

.debug .t--scrollend .listener-id2 { background: red; }

.debug .t--disp { border: solid 1px orange; }

.debug .t--scrollend { border: solid 1px red; }

.debug .fixed-box { border-top: solid 1px green; border-bottom: solid 1px green; }

.debug .fixed-box-inner { background: rgba(255, 255, 0, 0.1); }

.touch .effect-layer { display: none; }

/*# sourceMappingURL=home.css.map */