@charset "UTF-8";
@import url(https://rainbow-apps.com/css/common.css);
/* ///////////////////////////
webfont
/////////////////////////// */
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:300,400,600);
.mt0 {
  margin-top: 0px !important; }

.mt1 {
  margin-top: 10px !important; }

.mt15 {
  margin-top: 15px !important; }

.mt2 {
  margin-top: 20px !important; }

.mt25 {
  margin-top: 25px !important; }

.mt3 {
  margin-top: 30px !important; }

.mt35 {
  margin-top: 35px !important; }

.mt4 {
  margin-top: 40px !important; }

.mt45 {
  margin-top: 45px !important; }

.mt5 {
  margin-top: 50px !important; }

.mt55 {
  margin-top: 55px !important; }

.mt6 {
  margin-top: 60px !important; }

.mt65 {
  margin-top: 65px !important; }

.mt7 {
  margin-top: 70px !important; }

.mt75 {
  margin-top: 75px !important; }

.mt8 {
  margin-top: 80px !important; }

.mt85 {
  margin-top: 85px !important; }

.mt9 {
  margin-top: 90px !important; }

.mt95 {
  margin-top: 95px !important; }

.mt10 {
  margin-top: 100px !important; }

.mb0 {
  margin-bottom: 0px !important; }

.mb1 {
  margin-bottom: 10px !important; }

.mb15 {
  margin-bottom: 15px !important; }

.mb2 {
  margin-bottom: 20px !important; }

.mb25 {
  margin-bottom: 25px !important; }

.mb3 {
  margin-bottom: 30px !important; }

.mb35 {
  margin-bottom: 35px !important; }

.mb4 {
  margin-bottom: 40px !important; }

.mb45 {
  margin-bottom: 45px !important; }

.mb5 {
  margin-bottom: 50px !important; }

.mb55 {
  margin-bottom: 55px !important; }

.mb6 {
  margin-bottom: 60px !important; }

.mb65 {
  margin-bottom: 65px !important; }

.mb7 {
  margin-bottom: 70px !important; }

.mb75 {
  margin-bottom: 75px !important; }

.mb8 {
  margin-bottom: 80px !important; }

.mb85 {
  margin-bottom: 85px !important; }

.mb9 {
  margin-bottom: 90px !important; }

.mb95 {
  margin-bottom: 95px !important; }

.mb10 {
  margin-bottom: 100px !important; }

.mr0 {
  margin-right: 0px !important; }

.mr1 {
  margin-right: 10px !important; }

.mr15 {
  margin-right: 15px !important; }

.mr2 {
  margin-right: 20px !important; }

.mr25 {
  margin-right: 25px !important; }

.mr3 {
  margin-right: 30px !important; }

.mr35 {
  margin-right: 35px !important; }

.mr4 {
  margin-right: 40px !important; }

.mr45 {
  margin-right: 45px !important; }

.mr5 {
  margin-right: 50px !important; }

.mr55 {
  margin-right: 55px !important; }

.mr6 {
  margin-right: 60px !important; }

.mr65 {
  margin-right: 65px !important; }

.mr7 {
  margin-right: 70px !important; }

.mr75 {
  margin-right: 75px !important; }

.mr8 {
  margin-right: 80px !important; }

.mr85 {
  margin-right: 85px !important; }

.mr9 {
  margin-right: 90px !important; }

.mr95 {
  margin-right: 95px !important; }

.mr10 {
  margin-right: 100px !important; }

.ml0 {
  margin-left: 0px !important; }

.ml1 {
  margin-left: 10px !important; }

.ml15 {
  margin-left: 15px !important; }

.ml2 {
  margin-left: 20px !important; }

.ml25 {
  margin-left: 25px !important; }

.ml3 {
  margin-left: 30px !important; }

.ml35 {
  margin-left: 35px !important; }

.ml4 {
  margin-left: 40px !important; }

.ml45 {
  margin-left: 45px !important; }

.ml5 {
  margin-left: 50px !important; }

.ml55 {
  margin-left: 55px !important; }

.ml6 {
  margin-left: 60px !important; }

.ml65 {
  margin-left: 65px !important; }

.ml7 {
  margin-left: 70px !important; }

.ml75 {
  margin-left: 75px !important; }

.ml8 {
  margin-left: 80px !important; }

.ml85 {
  margin-left: 85px !important; }

.ml9 {
  margin-left: 90px !important; }

.ml95 {
  margin-left: 95px !important; }

.ml10 {
  margin-left: 100px !important; }

.pt0 {
  padding-top: 0px !important; }

.pt1 {
  padding-top: 10px !important; }

.pt15 {
  padding-top: 15px !important; }

.pt2 {
  padding-top: 20px !important; }

.pt25 {
  padding-top: 25px !important; }

.pt3 {
  padding-top: 30px !important; }

.pt35 {
  padding-top: 35px !important; }

.pt4 {
  padding-top: 40px !important; }

.pt45 {
  padding-top: 45px !important; }

.pt5 {
  padding-top: 50px !important; }

.pt55 {
  padding-top: 55px !important; }

.pt6 {
  padding-top: 60px !important; }

.pt65 {
  padding-top: 65px !important; }

.pt7 {
  padding-top: 70px !important; }

.pt75 {
  padding-top: 75px !important; }

.pt8 {
  padding-top: 80px !important; }

.pt85 {
  padding-top: 85px !important; }

.pt9 {
  padding-top: 90px !important; }

.pt95 {
  padding-top: 95px !important; }

.pt10 {
  padding-top: 100px !important; }

.pb0 {
  padding-bottom: 0px !important; }

.pb1 {
  padding-bottom: 10px !important; }

.pb15 {
  padding-bottom: 15px !important; }

.pb2 {
  padding-bottom: 20px !important; }

.pb25 {
  padding-bottom: 25px !important; }

.pb3 {
  padding-bottom: 30px !important; }

.pb35 {
  padding-bottom: 35px !important; }

.pb4 {
  padding-bottom: 40px !important; }

.pb45 {
  padding-bottom: 45px !important; }

.pb5 {
  padding-bottom: 50px !important; }

.pb55 {
  padding-bottom: 55px !important; }

.pb6 {
  padding-bottom: 60px !important; }

.pb65 {
  padding-bottom: 65px !important; }

.pb7 {
  padding-bottom: 70px !important; }

.pb75 {
  padding-bottom: 75px !important; }

.pb8 {
  padding-bottom: 80px !important; }

.pb85 {
  padding-bottom: 85px !important; }

.pb9 {
  padding-bottom: 90px !important; }

.pb95 {
  padding-bottom: 95px !important; }

.pb10 {
  padding-bottom: 100px !important; }

.pr0 {
  padding-right: 0px !important; }

.pr1 {
  padding-right: 10px !important; }

.pr15 {
  padding-right: 15px !important; }

.pr2 {
  padding-right: 20px !important; }

.pr25 {
  padding-right: 25px !important; }

.pr3 {
  padding-right: 30px !important; }

.pr35 {
  padding-right: 35px !important; }

.pr4 {
  padding-right: 40px !important; }

.pr45 {
  padding-right: 45px !important; }

.pr5 {
  padding-right: 50px !important; }

.pr55 {
  padding-right: 55px !important; }

.pr6 {
  padding-right: 60px !important; }

.pr65 {
  padding-right: 65px !important; }

.pr7 {
  padding-right: 70px !important; }

.pr75 {
  padding-right: 75px !important; }

.pr8 {
  padding-right: 80px !important; }

.pr85 {
  padding-right: 85px !important; }

.pr9 {
  padding-right: 90px !important; }

.pr95 {
  padding-right: 95px !important; }

.pr10 {
  padding-right: 100px !important; }

.pl0 {
  padding-left: 0px !important; }

.pl1 {
  padding-left: 10px !important; }

.pl15 {
  padding-left: 15px !important; }

.pl2 {
  padding-left: 20px !important; }

.pl25 {
  padding-left: 25px !important; }

.pl3 {
  padding-left: 30px !important; }

.pl35 {
  padding-left: 35px !important; }

.pl4 {
  padding-left: 40px !important; }

.pl45 {
  padding-left: 45px !important; }

.pl5 {
  padding-left: 50px !important; }

.pl55 {
  padding-left: 55px !important; }

.pl6 {
  padding-left: 60px !important; }

.pl65 {
  padding-left: 65px !important; }

.pl7 {
  padding-left: 70px !important; }

.pl75 {
  padding-left: 75px !important; }

.pl8 {
  padding-left: 80px !important; }

.pl85 {
  padding-left: 85px !important; }

.pl9 {
  padding-left: 90px !important; }

.pl95 {
  padding-left: 95px !important; }

.pl10 {
  padding-left: 100px !important; }

/* ==========================================================
	COMMON
========================================================== */
#header .navi-btm .nav-class .parent {
  background-position: center top; }

#header .navi-btm .nav-class .parent span {
  color: #9abd2e; }

.h1-area {
  padding: 20px 0 16px;
  background-color: #9abd2e; }
  .h1-area h1 {
    vertical-align: middle; }
  .h1-area img {
    width: 40px;
    vertical-align: middle;
    margin-right: 5px; }

section {
  max-width: 800px;
  width: 94%;
  padding: 6% 3%;
  margin: 0 auto; }
  section p {
    text-align: left; }

.main-area {
  margin-bottom: 50px; }
  .main-area p {
    color: #fff;
    text-align: center; }
  .main-area .icon {
    width: 58px;
    margin: 0 auto 10px; }
  .main-area h2 {
    letter-spacing: 5px;
    text-align: center;
    font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    font-size: 35px;
    color: #fff;
    margin-bottom: 10px; }
  .main-area .colorful-line {
    width: 460px;
    margin: 0 auto 20px; }
  .main-area .flow {
    width: 80%;
    margin: 6% auto 6%; }
  .main-area .catch {
    font-size: 25px;
    margin-bottom: 30px;
    font-size: 23px;
    line-height: 1.8;
    font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"; }
  .main-area .sub-catch {
    line-height: 1.8;
    font-size: 16px; }
  .main-area .radius {
    text-align: center;
    margin-bottom: 30px; }
    .main-area .radius span {
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      color: #fff;
      border: 2px solid #fff;
      padding: 5px 10px;
      line-height: 1; }

article h3 {
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  color: #fff;
  font-size: 28px;
  text-align: center;
  padding: 10px 0;
  background-color: #444;
  width: 95%;
  margin: 0 auto; }

.syllabus {
  max-width: 980px; }
  .syllabus table {
    margin-top: 5%; }
    .syllabus table tr {
      border-bottom: 1px solid #fff; }
    .syllabus table tr:nth-child(odd) th, .syllabus table tr:nth-child(odd) td {
      background-color: #ebf7c6; }
    .syllabus table tr:nth-child(odd) .number {
      background-color: #9abd2e; }
    .syllabus table tr:nth-child(even) th, .syllabus table tr:nth-child(even) td {
      background-color: #fff; }
    .syllabus table tr:nth-child(even) .number {
      background-color: #9abd2e; }
    .syllabus table th, .syllabus table td {
      text-align: left;
      vertical-align: middle;
      padding: 1% 2%; }
    .syllabus table td.number {
      color: #fff;
      font-size: 30px;
      width: 8%;
      text-align: center; }
    .syllabus table th {
      font-size: 20px;
      width: 30%;
      font-weight: normal; }

.graph table {
  width: 100%;
  margin-top: 0; }
  .graph table th {
    width: 20%;
    text-align: center;
    color: #fff;
    font-weight: normal;
    border-bottom: 1px solid #fff;
    padding: 1.5% 2% 1%; }
  .graph table td {
    background-color: #fff !important;
    border: 1px solid #e5e6e6; }
    .graph table td a:hover {
      text-decoration: underline; }

.entryStep .anno {
  color: #f64c68; }
.entryStep table th {
  width: 13%;
  text-align: center !important; }
  .entryStep table th img {
    width: 10px; }
.entryStep table .txt {
  font-size: 14px;
  margin-top: 10px;
  display: block; }
.entryStep table .ttl {
  display: block;
  font-size: 18px; }

.skill {
  max-width: 1050px; }
  .skill ul {
    margin: 0 auto 10px;
    width: 780px; }
    .skill ul li {
      display: inline-block;
      *display: inline;
      *zoom: 1;
      vertical-align: middle;
      font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      margin: 1%;
      width: 260px;
      font-size: 20px; }
      .skill ul li span {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        vertical-align: middle;
    width: 150px; }
      .skill ul li .checkicon {
        width: 44px;
        margin-right: 3%; }
    .skill ul li:nth-child(3),
    .skill ul li:nth-child(6) {
      width: 200px; }
  .skill .notice {
    font-size: 12px;
    text-indent: -1em;
    padding-left: 1em;
    width: 750px;
    margin: 0 auto; }

.course {
  max-width: 980px; }
  .course .course-box h4 p {
    text-align: center; }

.class {
  max-width: 1050px; }
  .class .enf {
    text-align: center; }

section .link-pink {
  text-align: center;
  width: 33%;
  margin: 5% auto 0 auto;
  letter-spacing: 4px;
  font-size: 20px; }

section .link-pink .btn-txt {
  margin-top: 2px; }

section .link-pink span {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  vertical-align: middle; }

section .link-pink a {
  color: #fff;
  padding: 20px 0 19px;
  display: block;
  background-color: #f64c68;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

section .link-pink a:hover {
  opacity: 0.6;
  filter: alpha(Opacity=60);
  transition: 0.3s ease;
  -webkit-transition: 0.3s ease;
  -moz-transition: 0.3s ease;
  -ms-transition: 0.3s ease;
  -ms-filter: "alpha(opacity=60)";
  text-decoration: none; }

section .link-pink ._iebg {
  width: 28px;
  height: 28px;
  margin-right: 1%;
  background-image: url("https://rainbow-apps.com/images/common/arrow_white_1.png");
  background-position: left top;
  background-repeat: no-repeat;
  background-size: cover; }

.class-block .class-title{
  display:flex;
  align-items:center;
}
@media screen and (max-width: 740px){
  .class-block .class-title{
    justify-content: center;
  }
}

/* ==========================================================
	iOS
========================================================== */
.class-ios .main-area {
  background-color: #9abd2e; }

/* ==========================================================
	Unity
========================================================== */
.class-unity .main-area,
.class-unity .syllabus table tr:nth-child(odd) .number,
.class-unity .syllabus table tr:nth-child(even) .number {
  background-color: #64c369; }
.class-unity .syllabus table tr:nth-child(odd) th,
.class-unity .syllabus table tr:nth-child(odd) td {
  background-color: #d9f6db; }


/* ==========================================================
	uiux
========================================================== */
.class-uiux .main-area,
.class-uiux .syllabus table tr:nth-child(odd) .number,
.class-uiux .syllabus table tr:nth-child(even) .number {
  background-color: #4bc47e; }
.class-uiux .syllabus table tr:nth-child(odd) th,
.class-uiux .syllabus table tr:nth-child(odd) td {
  background-color: #cdfce1; }


/* ==========================================================
	Android
========================================================== */
.class-android .main-area,
.class-android .syllabus table tr:nth-child(odd) .number,
.class-android .syllabus table tr:nth-child(even) .number {
  background-color: #78bd2e; }
.class-android .syllabus table tr:nth-child(odd) th,
.class-android .syllabus table tr:nth-child(odd) td {
  background-color: #e4f9ce; }

/* ==========================================================
	共通背景
========================================================== */
#course .entryStep table tr:nth-child(odd) .number,
#course .entryStep table tr:nth-child(even) .number {
  background-color: #9abd2e; }

#course .lead {
  text-align: center;
  margin-bottom: 5%; }

/* ==========================================================
	SP 920px以下
========================================================== */
@media screen and (max-width: 920px) {
  .h1-area img {
    width: 27px; }

  section {
    padding: 6% 3%; }

  .main-area .icon {
    width: 45px;
    margin: 0 auto 10px; }
  .main-area h2 {
    font-size: 25px; }
  .main-area .colorful-line {
    width: 100%;
    margin: 0 auto 20px; }
  .main-area .catch {
    font-size: 16px;
    margin-bottom: 20px; }
  .main-area .sub-catch {
    font-size: 14px; }

  article h3 {
    font-size: 19px; }

  .syllabus {
    max-width: 1100px; }
    .syllabus table th, .syllabus table td {
      text-align: left;
      vertical-align: middle;
      padding: 5px; }
    .syllabus table td.number {
      font-size: 16px;
      width: 9%; }
    .syllabus table th {
      font-size: 14px;
      width: 35%;
      padding: 10px; }

  .skill ul li:nth-child(3),
  .skill ul li:nth-child(6) {
    width: 260px; }

  .skill ul {
    width: 550px; }

  .skill .notice {
    width: 520px; }

  section .link-pink {
    width: 320px; }
	.skill ul li span {
    width: 80%;
} }
/* ==========================================================
	SP 640px以下
========================================================== */
@media screen and (max-width: 640px) {
  .h1-area {
    padding: 10px 0 10px;
    background-color: #9abd2e; }
    .h1-area img {
      width: 20px; }

  .main-area h2 {
    font-size: 20px; }

  .main-area .colorful-line {
    margin-bottom: 2%; }

  .main-area .icon {
    width: 35px; }

  .main-area .radius {
    margin-bottom: 20px; }

  .skill ul {
    margin: 0 auto 10px;
    width: 100%; }
    .skill ul li {
      font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
      display: block;
      margin: 0 0 10px;
      width: 80%;
      font-size: 17px;
      line-height: 30px; }

  .skill .notice {
    width: 96%; }

  section .link-pink {
    width: 100%; }

  .main-area .flow {
    width: 90%; }
.skill ul li span{
    width: initial;
	} }
