.mv-scroll { position: absolute; z-index: 1; bottom: 28px; right: 21px; height: 110px;}
.mv-scroll .text { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; height: 40px; font-family: fieldwork, sans-serif; font-style: italic; color: /*#1c2a53*/#323333; font-size: 11px; letter-spacing: 0.06em; margin-top: 60px;  font-weight: 400}
.mv-scroll .bar { width: 12px; height: 50px; overflow: hidden; position: absolute; top: 0; left: 0.4em; }
.mv-scroll .bar:before,.mv-scroll .bar:after { position: absolute; top: 0; left: 0; display: block; width: 1px; height: 100%; content: ''; }
.mv-scroll .bar:before { z-index: 10; -webkit-animation: scroll 2.4s infinite normal; animation: scroll 2.4s infinite normal; background: #323333;}
.mv-scroll .bar:after { background: #e0eaea;}

@-webkit-keyframes scroll{
	0%{-webkit-transform:translate3d(0,-100%,0)}
	15%{-webkit-transform:translate3d(0,-98%,0)}
	85%{-webkit-transform:translate3d(0,98%,0)}
	100%{-webkit-transform:translate3d(0,100%,0)}
}
@keyframes scroll{
	0%{transform:translate3d(0,-100%,0)}
	15%{transform:translate3d(0,-98%,0)}
	85%{transform:translate3d(0,98%,0)}
	100%{transform:translate3d(0,100%,0)}
}

/* business */
.business { max-width: 1600px; margin-left: auto; margin-right: auto;}
.business-inr { padding:0 30px;}
.business-titlearea { position: relative;}
.business-titlearea .title {float: left; position: relative; padding-top: 11px; }
.business-titlearea .title ._jp { font-size: 18px; line-height: 1; position:relative; color: #3094C6; font-weight: 700; top:7px; left: 5px; }
.business-titlearea .title ._en { font-size: 130px; line-height: 1; font-weight: 600;}
.business-titlearea .text { float: left; font-size: 18px; line-height: 1.75; font-weight: 600; padding: 74px 0 0 32px;}
.business-list { margin-top: 75px;}
.business-item { width: calc(50% - 20px); float: left; margin-bottom: 80px;}
.business-item:nth-child(even) { margin-left: 40px;}
.business-inr a { color: #323333; display: inline-block}
.business-item figure { display:block;}
.business-item .title { font-size: 78px; line-height: 1; margin-top: 12px; font-style: italic; display: inline-block; padding-right: 20px;}
.business-item .title._s { font-size: 70px;}
.business-item .title i { width: 60px; display: inline-block; margin-right: 4px; position: relative; top: 0px;}
.business-inr .btn { display: inline-block; border: solid 1px #323333; border-radius: 50%; height: 30px; width: 30px; position: relative; top: -6px; left: 16px; overflow: hidden;}
.business-inr .btn img { display: none; position: absolute;left: 0; top: 11px; width: 12px; right: 0; margin: 0 auto; transition: 0.2s}
.business-inr .title:hover .btn img { left: 50px; transform-origin: left center; transition: 0;}
.business-inr .title .btn::before,
.business-inr .title .btn::after,
.business-inr .btm-text .btn::before,
.business-inr .btm-text .btn::after { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; background: url("../img/icon_arw.png") no-repeat center; background-size: 12px; transition: transform ease .3s;}
.business-inr .title .btn::before,
.business-inr .btm-text .btn::before { transform-origin: 100% 50%; transform: scaleX(0);}
.business-inr .title .btn::after,
.business-inr .btm-text .btn::after { transform-origin: 0% 50%; transform: scaleX(1);}
.business-inr .title:hover .btn:before,
.business-inr .btm-text:hover .btn::before{ transform-origin: 0% 50%; transform: scaleX(1); }
.business-inr .title:hover .btn:after,
.business-inr .btm-text:hover .btn::after { transform-origin: 100% 50%; transform: scaleX(0); }
.business-item .label { font-weight: 600; margin-top: 10px; letter-spacing: normal;}
.business .btm-text { font-size: 53px; margin-top:0px; color: #323333; clear: both; float: right; margin-bottom: 200px; margin-right: 5px; line-height: 1; font-style: italic; letter-spacing: -0.02em; font-weight: 600;}
.business .btm-text .btn { top: 3px; left: 10.5px;}
.title_mv { position: relative; font-size: 118px; left: 0px; transform: translateY(0%); z-index: 1; overflow: hidden;}
.title_mv > p{ font-family: 'Oswald', sans-serif;  color: #323333;font-weight: bold; line-height: 1;vertical-align: top; position: relative; opacity: 0; overflow: hidden;}
.title_mv > p > span{ opacity: 0; display: inline-block;}
.title_mv.scrollin > p > span.textmove { -webkit-animation: animMainVisual .5s ease forwards; animation: animMainVisual .5s ease forwards;}
@keyframes animMainVisual {
    0% { opacity: 0; transform: translateY(100%);}
    100% { opacity: 1; transform: none;}
}
@-webkit-keyframes animMainVisual {
    0% { opacity: 0; -webkit-transform: translateY(100%);}
    100% { opacity: 1; -webkit-transform: none;}
}
.business-titlearea .text { opacity: 0; -webkit-transition:all 0.5s; -moz-transition:all 0.5s; -ms-transition:all 0.5s; transition:all 0.5s; transform: translate3d(50px,0, 0);}
.business-titlearea .text.scrollin { opacity: 1; transform: translate3d(0px,0, 0); }

@media screen and (max-width:1200px){
	.mv-scroll { bottom: 18px; right: 12px; }
	.business-inr { padding:0 20px;}
	.business-titlearea .title { padding-top: 11px; }
	.business-titlearea .title ._jp { font-size: 16px; top:8px; left: 5px; }
	.business-titlearea .title ._en { font-size: 130px; letter-spacing: -0.01em; }
	.business-titlearea .text { font-size: 16px; padding: 62px 0 0 24px;}
	.business-list { max-width: 1400px; margin-top: 52px;}
	.business-item { width: calc(50% - 4px); margin-bottom: 68px;}
	.business-item:nth-child(even) { margin-left: 8px;}
	.business-item .title { font-size: 65px; margin-top: 10px; }
	.business-item .title._s { font-size: 60px;}
	.business-item .title i { width: 54px; margin-right: 6px;}
	.business-inr .btn { height: 28px; width: 28px;top: -6px; left: 15px;}
	.business-inr .btn img { top: 11px; width: 11px; }
	.business-inr .title .btn::before,
	.business-inr .title .btn::after,
	.business-inr .btm-text .btn::before,
	.business-inr .btm-text .btn::after { background-size: 11px;}
	.business .btm-text .btn { top: 3px; left: 8px;}
	.business-item .label { margin-top: 7px; font-size: 14px; }
	.business .btm-text { font-size: 46px; margin-top:0px; margin-bottom: 140px; margin-right: 14px; }
	.title_mv { font-size: 100px; }
	.business-titlearea .text { transform: translate3d(50px,0, 0);}
}

@media screen and (max-width:900px){
	.business-inr { padding:0 14px;}
	.business-titlearea .title { padding-top: 11px; float: none;}
	.business-titlearea .title ._jp { font-size: 16px; top:7px; left: 5px; }
	.business-titlearea .text { font-size: 15px; padding: 11px 0 0 5px; display: block; float: none; line-height: 1.6; letter-spacing: normal}
	.business-list { margin-top: 55px;}
	.business-item { width: calc(50% - 4px); margin-bottom: 58px;}
	.business-item:nth-child(even) { margin-left: 8px;}
	.business-item .title { font-size: 58px; margin-top: 8px; }
	.business-item .title._s { font-size: 55px;}
	.business-item .title i { width: 46px; margin-right: 3px; top: 0;}
	.business-inr .btn { height: 25px; width: 25px;top: -1px; left: 10px;}
	.business-inr .btn img { top: 9px; width: 10px; }
	.business-inr .title .btn::before,
	.business-inr .title .btn::after,
	.business-inr .btm-text .btn::before,
	.business-inr .btm-text .btn::after { background-size: 10px;}
	.business-item .label { margin-top: 6px; font-size: 13px; }
	.business .btm-text { font-size: 44px; margin-top:0px; margin-bottom: 120px; margin-right: 11px; }
	.title_mv { font-size: 100px; }
	.business-titlearea .text { transform: translate3d(40px,0, 0);}
}
@media screen and (max-width:768px){
	.mv-scroll { bottom: 50px; right: 11px; height: 63px;}
	.mv-scroll .text { height: 40px; font-size: 10px; margin-top: 50px; }
	.mv-scroll .bar { width: 10px; height: 40px; }
	.business-inr { padding:0 10px;}
	.business-titlearea .title { padding-top: 11px;}
	.business-titlearea .title ._jp { font-size: 15px; top:7px; left: 5px; }
	.business-titlearea .text { font-size: 14px; padding: 8px 0 0 5px; display: block; float: none; line-height: 1.6}
	.business-list { margin-top: 48px;}
	.business-item { width: calc(50% - 3px); margin-bottom: 46px;}
	.business-item:nth-child(even) { margin-left: 6px;}
	.business-item .title { font-size: 46px; margin-top: 4px; }
	.business-item .title._s { font-size: 42px;}
	.business-item .title i { width: 39px; margin-right: 3px;}
	.business-item .title a { height: 24px; width: 24px;top: -2px; left: 13px;}
	.business-item .title a img { top: 9px; width: 10px; }
	.business-item .label { margin-top: 5px; font-size: 11px; }
	.business .btm-text { font-size: 36px; margin-top:0px; margin-bottom: 110px; margin-right: 11px; }
	.title_mv { font-size: 85px; }
	.business-titlearea .text { transform: translate3d(30px,0, 0);}
}
@media screen and (max-width:480px){
	.business-inr { padding:0 10px;}
	.business-titlearea .title { padding-top: 11px; float: none; left: -3px}
	.business-titlearea .title ._jp { font-size: 14px; top:8px; left: 5px; }
	.business-titlearea .text { font-size: 12px; padding: 7px 0 0 0; display: block; float: none; line-height: 1.6;}
	.business-list { margin-top: 35px; width: 100%}
	.business-item { width: calc(100%); margin-bottom: 46px;}
	.business-item:nth-child(even) { margin-left: 0px;}
	.business-item .title { font-size: 57px; margin-top: 3px; }
	.business-item .title._s { font-size: 52px;}
	.business-item .title i { width: 46px; margin-right: 6px;}
	.business-inr .btn { height: 24px; width: 24px;top: -3px; left: 12px;}
	.business-inr .btn img { top: 9px; width: 9px; }
	.business-inr .title .btn::before,
	.business-inr .title .btn::after,
	.business-inr .btm-text .btn::before,
	.business-inr .btm-text .btn::after { background-size: 9px;}
	.business .btm-text .btn { top: 3px; left: 10.5px;}
	.business-item .label { margin-top: 7px; font-size: 10px;}
	.business .btm-text { font-size: 30px; margin-top:0px; margin-bottom: 90px; margin-right: 9px; }
	.title_mv { font-size: 76px; }
	.business-titlearea .text { transform: translate3d(50px,0, 0);}
}
@media screen and (max-width:480px){
	.mv-scroll { bottom: 40px; right: 7px; height: 65px;}
	.mv-scroll .text { height: 40px; font-size: 9px; margin-top: 50px; }
	.business-item .title { font-size: 53px; margin-top: 6px; }
	.business-item .title._s { font-size: 48px;}
	.business-item .title i { width: 42px; margin-right: 3px; top: -1px;}
	.business-item .label { margin-top: 1px; font-size: 12px;}
	.business-inr .btn {top: -2px;}
	.business .btm-text .btn { top: 4px; left: 7.5px;}
}
