@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP');

/* =========================================================
1.基礎構造
2.共通部分
3.ページ個別部分
4.汎用クラス
========================================================= */

/* =========================================================
1.基礎構造
========================================================= */

/* =========================================================
2.共通パーツ部分
========================================================= */

/* =========================================================
3.ページ個別部分
========================================================= */

/*index*/


body#rt_push {
	width: 100%;
	font-family: 'Noto Sans JP', sans-serif;
}

#rt_push .header {
	width: 100%;
	background-color: #fb5844;
}

#rt_push .header .bg_box {
	background: url(../img/bg_img.jpg) no-repeat center center;
	background-size: cover;
	width: 100%;
	max-width: 1200px;
	min-width: 980px;
	margin: 0 auto;
}

#rt_push .header .bg_box h1 {
	width: 622px;
    margin: 0 auto;
}

#rt_push .header .bg_box h1 img {
	margin-top: 50px;
}

#rt_push .header .bg_box p.text {
	width: 622px;
    font-size: 1.3em;
    color: #000;
    font-weight: bold;
    margin: 25px auto;
    text-align: center;
    background-color: #fff;
}

#rt_push .header .bg_box p.powerd_by {
	width: 196px;
	margin: 0 auto;
}

#rt_push .header .bg_box p.powerd_by img {
	margin-bottom:120px;
}

#rt_push #contents {
	width: 100%;
}

#rt_push #contents section {
	width: 980px;
	margin: 0 auto;
	position: relative;
	top: -80px;
	background-color: #fff;
	padding: 40px 0 0;
}

#rt_push #contents h2 {
	margin: 0px auto 34px;
    text-align: center;
}

#rt_push #contents h2 span {
	display: inline-block;
    background: #000;
    color: #fff;
    padding: 0 8px;
    margin-top: 20px;
}

#rt_push #contents .user_flow h2 {
	width: 266px;
}

#rt_push #contents .user_flow .flow_box,
#rt_push #contents .scene .scene_box {
	overflow: hidden;
}

#rt_push #contents .user_flow .flow_box .flow1_box,
#rt_push #contents .user_flow .flow_box .flow2_box,
#rt_push #contents .user_flow .flow_box .flow3_box {
	width: 263px;
    float: left;
    position: relative;
}
#rt_push #contents .user_flow .flow_box .flow1_box {
	margin-left: 95px;
}

#rt_push #contents .user_flow .flow_box .flow2_box {
	width: 264px;
}

#rt_push #contents .user_flow .flow_box .flow3_box {
	margin-right: 95px;
}

#rt_push #contents .user_flow .flow_box .flow1_box p,
#rt_push #contents .user_flow .flow_box .flow2_box p,
#rt_push #contents .user_flow .flow_box .flow3_box p {
	background: #000;
    color: #fff;
    display: inline-block;
    padding-right: 10px;
    position: relative;
}

#rt_push #contents .user_flow .flow_box .flow1_box p {
    top: -360px;
    left: -72px;
}

#rt_push #contents .user_flow .flow_box .flow2_box p {
    top: 355px;
    left: 31.5px;
}

#rt_push #contents .user_flow .flow_box .flow2_box img.allow01 {
	width: 44px;
    position: absolute;
    top: 250px;
    left: 15px;
}

#rt_push #contents .user_flow .flow_box .flow2_box img.clock {
	width: 120px;
    position: absolute;
    top: 220px;
    left: 75px;
}

#rt_push #contents .user_flow .flow_box .flow2_box img.allow02 {
	width: 44px;
    position: absolute;
    top: 250px;
    right: 15px;
}

#rt_push #contents .user_flow .flow_box .flow3_box p {
	position: absolute;
    top: 120px;
    left: -55px;
}

#rt_push #contents .user_flow .flow_box .flow2_box{}

#rt_push #contents .user_flow .flow_box .flow1_box p span,
#rt_push #contents .user_flow .flow_box .flow2_box p span,
#rt_push #contents .user_flow .flow_box .flow3_box p span {
	background: #fb5844;
    padding: 2px 8px;
    display: inline-block;
    margin-right: 10px;
}

#rt_push #contents .scene h2 {
	width: 158px;
}

#rt_push #contents .scene .scene_box {
	display: flex;
}



#rt_push #contents .scene .scene_box div {
	padding: 30px 40px;
	width: 324px;
    margin-right: 4px;
    background: #fb5844;
    float: left;
}

#rt_push #contents .scene .scene_box div.scene3_box {
	margin: 0;
}

#rt_push #contents .scene .scene_box div.scene1_box img {
	width: 146px;
    margin: 13px auto 0;
    display: block;
}

#rt_push #contents .scene .scene_box div.scene2_box img {
	width: 78px;
    margin: 0 auto;
    display: block;
}

#rt_push #contents .scene .scene_box div.scene3_box img {
	width: 101px;
    margin: 18px auto 0;
    display: block;
}

#rt_push #contents .scene .scene_box div h3 {
	color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 1.1em;
    margin: 20px 0;
}

#rt_push #contents .scene .scene_box div p {
	color: #fff;
    font-size: 0.8em;
}

#rt_push #contents .over_view {
	padding: 80px 0 0
}

#rt_push #contents .over_view h2 {
	width: 290px;
	margin-bottom: 80px;
}

#rt_push #contents .over_view .overView_twitter_box {
	border: 4px solid #5eaade;
    position: relative;
    width: 745px;
    margin: 0 auto;
    padding: 70px 40px 318px;
}

#rt_push #contents .over_view .overView_twitter_box h3 {
	background: #5eaade;
    display: inline-block;
    padding: 2px 8px;
    color: #fff;
    position: relative;
    top: -95px;
    left: -215px;
    font-size: 1.7em;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box1 {
	width: 245px;
    text-align: center;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box1 p,
#rt_push #contents .over_view .overView_twitter_box .overview_box3 p {
	font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 40px;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box1 img {
	width: 164px;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box2 {
	width: 247px;
    position: relative;
    text-align: center;
    top: 160px;
    left: -30px;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box2 img {
	width: 76px;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box3 {
	width: 245px;
    float: right;
    text-align: center;
    position: relative;
    top: -44px;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box3 img {
	width: 125px;
}

#rt_push #contents .over_view .overView_twitter_box .overview_box3 .small_text {
	font-size: 1em;
	margin:40px 0 0;
}

#rt_push #contents .over_view .overView_rtpush_box {
	border: 4px solid #fb5844;
    width: 745px;
    margin: 50px auto;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box4,
#rt_push #contents .over_view .overView_rtpush_box .overview_box6 {
	position: relative;
    width: 245px;
    float: left;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box4 p,
#rt_push #contents .over_view .overView_rtpush_box .overview_box6 p {
	background: #000;
    color: #fff;
    display: inline-block;
    text-align: center;
    font-size: 1.5em;
    padding: 15px 20px;
    line-height: 1.3em;
    font-weight: bold;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box4 p {
	position: absolute;
    top: -35px;
    left: -115px;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box4 img {
	width: 129px;
    position: relative;
    top: -40px;
    left: 145px;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box5 {
	float: left;
    text-align: center;
    width: 247px;
}

#rt_push #contents .over_view .overView_rtpush_box img.sp {
	display: none;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box5 img {
	width: 91px;
    margin: 20px auto;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box5 p {
	font-weight: bold;
    font-size: 1.5em;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box6 p {
	position: absolute;
    right: -30px;
    top: -19px;
    z-index: 1;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box6 img {
	width: 198px;
    position: absolute;
    top: -174px;
    left: -179px;
    z-index: 0;
}

#rt_push #contents .over_view .overView_rtpush_box .overview_box6 img.exc {
	width: 102px;
    position: absolute;
    top: -95px;
    left: 215px;
    z-index: 1;
}

#rt_push #contents .over_view .overView_rtpush_box .rtPush_logo {
	width: 256px;
    display: block;
    clear: both;
    margin: 0 auto 40px;
    padding-top: 40px;
}

#rt_push #contents .button_box {
	text-align: center;
	padding: 20px 0 0;
}

#rt_push #contents .button_box a.inq {
	display: inline-block;
    position: relative;
    background: #fb5844;
    color: #fff;
    padding: 15px 25px;;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 5px 5px #6bdfdc;
    font-size: 2em;
    font-weight: bold;
    border-radius: 10px;
}

#rt_push #contents .button_box p {
	margin-top: 30px;
    font-size: 1.5em;
    font-weight: bold;
}

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

	#rt_push .header .bg_box {
		background: url(../img/bg_img.jpg) no-repeat center center;
		background-size: cover;
		width: 100%;
		max-width: 750px;
		min-width: 0;
		margin: 0 auto;
	}

	#rt_push .header .bg_box h1 {
		width: 82.935%;
	}

	#rt_push .header .bg_box h1 img {
		margin-top: 8%;
	}

	#rt_push .header .bg_box p.text {
		width: 82.935%;
	    margin: 5% auto;
	}

	#rt_push .header .bg_box p.powerd_by {
		width: 26.135%;
		margin: 0 auto;
	}

	#rt_push .header .bg_box p.powerd_by img {
		margin-bottom:61%;
	}

	#rt_push #contents section {
		width: 95%;
		top: -40px;

	}


	#rt_push #contents h2 {
		margin-bottom: 5%;
	}

	#rt_push #contents h2 span {
	    padding: 1% 3%;
	    margin-top: 8%;
	    font-size: 2vw;
	}

	#rt_push #contents .user_flow h2 {
		width: 39.408%;
	}

	#rt_push #contents .user_flow .flow_box,
	#rt_push #contents .scene .scene_box {
		overflow: hidden;
		padding-top: 5%;
	}

	#rt_push #contents .user_flow .flow_box {
		padding-top: 15%;
	}

	#rt_push #contents .user_flow .flow_box .flow1_box,
	#rt_push #contents .user_flow .flow_box .flow2_box,
	#rt_push #contents .user_flow .flow_box .flow3_box {
		width: 47%;
	    float: left;
	    position: relative;
	}
	#rt_push #contents .user_flow .flow_box .flow1_box {
		margin-left: 3%;
	}

	#rt_push #contents .user_flow .flow_box .flow1_box img,
	#rt_push #contents .user_flow .flow_box .flow3_box img {
		width: 78.54%;
	}

	#rt_push #contents .user_flow .flow_box .flow2_box {
		width: 100%;
		padding-bottom: 100%;
		position: absolute;
	}

	#rt_push #contents .user_flow .flow_box .flow3_box {
		margin-right: 3%;
		float: right;
		text-align: right;
	}

	#rt_push #contents .user_flow .flow_box .flow1_box p,
	#rt_push #contents .user_flow .flow_box .flow2_box p,
	#rt_push #contents .user_flow .flow_box .flow3_box p {
	    padding-right: 1vw;
	    position: absolute;
	    font-size: 2vw;
	}

	#rt_push #contents .user_flow .flow_box .flow1_box p {
	    top: 28%;
	    left: -3%;
	}

	#rt_push #contents .user_flow .flow_box .flow2_box p {
	    top: -13%;
	    left: 54.5%;
	}

	#rt_push #contents .user_flow .flow_box .flow2_box img.allow01 {
		width: 4.368%;
	    top: -4%;
	    left: 37%;
	    transform: rotate(-45deg);
	}

	#rt_push #contents .user_flow .flow_box .flow2_box img.clock {
		width: 16.844%;
	    top: -14%;
	    left: 42%;
	}

	#rt_push #contents .user_flow .flow_box .flow2_box img.allow02 {
		width: 4.368%;
	    top: -4%;
	    left: 59%;
	    transform: rotate(45deg);
	}

	#rt_push #contents .user_flow .flow_box .flow3_box p {
	    top: 22%;
	    left: 4%;
	    padding: 0;
	}

	#rt_push #contents .user_flow .flow_box .flow1_box p span,
	#rt_push #contents .user_flow .flow_box .flow2_box p span,
	#rt_push #contents .user_flow .flow_box .flow3_box p span {
	    padding: 0.5vw 1vw;
	    display: inline-block;
	    font-size: 2vw;
	    margin: 0;
	}

	#rt_push #contents .scene h2 {
		width: 22.176%;
	}

	#rt_push #contents .scene .scene_box {
		display: block;
	}


	#rt_push #contents .scene .scene_box div {
		float: none;
	    width: 100%;
	    margin-bottom: 0.4vh;
	    overflow: hidden;
	    margin-right: 0;
	    padding: 5.54vh 7.54vw;
	}

	#rt_push #contents .scene .scene_box div.scene3_box {
		margin: 0;
	}

	#rt_push #contents .scene .scene_box div.scene1_box img {
		width: 24.395%;
	    margin: 4vh auto;
	    float: left;
	}

	#rt_push #contents .scene .scene_box div.scene2_box img {
		width: 13.014%;
	    margin: 3vh 5vw;
	    float: left;
	}

	#rt_push #contents .scene .scene_box div.scene3_box img {
		width: 16.852%;
	    margin: 4vh 4vw;
	    float: left;
	}

	#rt_push #contents .scene .scene_box div h3 {
		font-size: 3vw;
	    text-align: left;
	    width: 60%;
	    float: right;
	    margin: 0 0 1vh;
	}

	#rt_push #contents .scene .scene_box div h3 br {
		line-height: 0;
	}

	#rt_push #contents .scene .scene_box div h3 br:first-child {
		display: none;
	}

	#rt_push #contents .scene .scene_box div p {
		width: 60%;
	    float: right;
	    font-size: 2vw;
	}

	

	#rt_push #contents .over_view {
		padding: 10.7% 0 0
	}

	#rt_push #contents .over_view h2 {
		width: 40.702%;
		margin-bottom: 11.3%;
	}

	#rt_push #contents .over_view .overView_twitter_box {
	    width: 80%;
	    padding: 7% 3% 49%;
	}

	#rt_push #contents .over_view .overView_twitter_box h3 {
	    padding: 0.3vh 1.1vw;
	    position: absolute;
	    top: -6.5%;
	    left: 41%;
	    font-size: 3.64vw;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box1 {
		width: 33%;
		margin-left: 3%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box1 p,
	#rt_push #contents .over_view .overView_twitter_box .overview_box3 p {
		font-size: 2.5vw;
	    margin-bottom: 15%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box3 p{
		margin-top: 10%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box1 img {
		width: 95.72%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box2 {
		width: 34%;
	    position: absolute;
	    top: 44%;
	    left: 32%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box2 img {
		width: 43.06%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box3 {
		width: 33%;
	    top: 0;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box3 img {
		width: 72.96%;
	}

	#rt_push #contents .over_view .overView_twitter_box .overview_box3 .small_text {
		font-size: 1.7vw;
		margin:15% 0 0;
		line-height: 2.5vw;
	}

	#rt_push #contents .over_view .overView_twitter_box br {
		line-height: 0;
	}

	
	#rt_push #contents .over_view .overView_rtpush_box {
	    width: 80%;
	    margin: 7% auto 5%;
	    position: relative;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box4,
	#rt_push #contents .over_view .overView_rtpush_box .overview_box6 {
		position: unset;
	    width: 0;
	    float: none;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box4 p,
	#rt_push #contents .over_view .overView_rtpush_box .overview_box6 p {
	    font-size: 3vw;
	    /*line-height: 3.5vw;*/
	    padding: 1.5vh 2vw;
	    z-index: 1;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box4 p br,
	#rt_push #contents .over_view .overView_rtpush_box .overview_box6 p br {
		line-height: 2vh;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box4 p {
	    top: 21%;
	    left: -13%;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box4 img {
		width: 25.802%;
	    position: absolute;
	    top: -12%;
	    left: 11%;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box5 {
		float: none;
	    width: 100%;
	    margin-top: 0 auto;
	}

	#rt_push #contents .over_view .overView_rtpush_box img.sp {
		display: block;
	}

	#rt_push #contents .over_view .overView_rtpush_box img.pc {
		display: none;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box5 img {
		width: 16.194%;
	    margin: 10% auto 2%;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box5 p {
	    font-size: 3vw;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box6 p {
	    top: 17.5%;
	    right: -14%;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box6 img {
		width: 27.582%;
	    top: -30%;
	    left: 45%;
	    z-index: 0;
	}

	#rt_push #contents .over_view .overView_rtpush_box .overview_box6 img.exc {
		width: 18.15%;
	    top: -8%;
	    left: 98.5%;
	}

	#rt_push #contents .over_view .overView_rtpush_box .rtPush_logo {
		width: 45.554%;
	    margin: 0 auto 7%;
	    padding-top: 5%;
	}

	#rt_push #contents .button_box {
		text-align: center;
		padding: 2.6% 0 0;
	}

	#rt_push #contents .button_box a.inq {
	    padding: 2.3vh 2.3vw;
	    box-shadow: 5px 5px #6bdfdc;
	    font-size: 4.27vw;
	}

	#rt_push #contents .button_box p {
		margin-top: 4.3%;
	    font-size: 3.2vw;
	}



}


/* =========================================================
4.汎用クラス
========================================================= */

/* フロート設定及びclearfix */
.left { float: left }
.right { float: right }
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/* テキストの位置 */
.tal { text-align: left; }
.tac { text-align: center; }
.tar { text-align: right; }

/* テキストサイズ
iOSで利用できるフォントサイズは8px以上から
google Chromeの初期状態で利用できるフォントサイズは8px以上から */

.fs8 { font-size: 0.8rem; }
.fs9 { font-size: 0.9rem; }
.fs10 { font-size: 1.0rem; }
.fs11 { font-size: 1.1rem; }
.fs12 { font-size: 1.2rem; }
.fs13 { font-size: 1.3rem; }
.fs14 { font-size: 1.4rem; }
.fs15 { font-size: 1.5rem; }
.fs16 { font-size: 1.6rem; }
.fs17 { font-size: 1.7rem; }
.fs18 { font-size: 1.8rem; }
.fs19 { font-size: 1.9rem; }
.fs20 { font-size: 2.0rem; }
.fs21 { font-size: 2.1rem; }
.fs22 { font-size: 2.2rem; }
.fs23 { font-size: 2.3rem; }
.fs24 { font-size: 2.4rem; }
.fs25 { font-size: 2.5rem; }
.fs26 { font-size: 2.6rem; }
.fs27 { font-size: 2.7rem; }
.fs28 { font-size: 2.8rem; }
.fs29 { font-size: 2.9rem; }
.fs30 { font-size: 3.0rem; }

/* マージンの指定 */
.mBtm20 { margin-bottom: 4% !important; }
.mBtm30 { margin-bottom: 6% !important; }
.mBtm40 { margin-bottom: 8% !important; }
.mBtm50 { margin-bottom: 10% !important; }
.mBtm60 { margin-bottom: 12% !important; }
.mBtm70 { margin-bottom: 14% !important; }
.mBtm80 { margin-bottom: 16% !important; }
.mBtm90 { margin-bottom: 18% !important; }
.mBtm100 { margin-bottom: 25% !important; }
.mBtmL { margin-bottom: 30% !important; }
.mTop30 { margin-top: 6% !important; }
.mTop40 { margin-top: 8% !important; }
.mTop50 { margin-top: 10% !important; }
.mTop60 { margin-top: 12% !important; }

/* 640px→%
5px = 0.78125%
10px = 1.5625%
12px = 1.875%
16px = 2.5%
20px = 3.125%
24px = 3.75%
28px = 4.375%
32px = 5%
36px = 5.625%
40px = 6.25%
*/
