@charset "utf-8";
/* CSS Document */

*{margin: 0; padding: 0}

html {
	font-family: Avenir, Arial, Helvetica, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
	color:#222222;
  background:#f1e3ae;
}

html,body{
  font-size:100%;
  height:100%;
}

img {
	border: none;
	max-width:100%;
	height:auto;
	}

.center	{ text-align:center; }
.left	{ text-align:left; }
.right	{ text-align:right; }
.float_right { float:right; }
.float_left { float:left; }

.caution {
  color:#a93c34;
  font-weight:bold;
}
.caution2 {
  font-size:1.5rem;
  line-height:2em;
  color:#a93c34;
  font-weight:bold;
}

sup {
  display: inline-block;
  margin-top: -8px;
  position: relative;
}

/* -------------------------------------------------------------------------------- */


#container {
  margin:0 auto;
  max-width:950px;
  background:#ffffff;
}

#header {
  border-top:3px solid #a93c34;
  border-bottom:1px solid #e7d6d6;
}
#header .inquery {
  float:right;
  padding:9px 12px 0 0;
}

#top img {
  vertical-align : middle;
}

#problem {
  font-size:1.25em;
  line-height:1.6em;
}
#problem p {
    padding:14px 50px;
}
#problem ul {
  list-style : none;
  padding-left:37px;
}
#problem li {
  float:left;
  padding:8px 13px;
}

#method {
  color:#757575;
  /* font-size:30px; */
  font-size:1.875em;
  font-weight:bold;
  text-align:center;
  padding:20px 0 10px 0;
}

#training {
  font-size:1.25em;
  line-height:1.6em;
  background:#fcf8ec;
  padding-bottom:40px;
}
#training p {
  padding:14px 50px;
}
#training ul {
  list-style : none;
  padding-left:37px;
}
#training li {
  float:left;
  padding:8px 13px;
}
#training .person {
 margin-right:50px;
 background:url(../images/person.png) no-repeat right;
}
#training h3{
  font-size:1.2em;
  font-weight:bold;
  color:#a93c34;
  background:#ffffff;
  border:2px solid #a93c34;
  margin:14px 50px 8px 50px;
  padding:10px 20px 8px 20px;
}
#training .detail {
  margin:0px 20px;
}

#user_voice {
  font-size:1em;
  background:#ffffff;
  padding:30px 0 30px 0;
}
#user_voice .user{
  display:inline-block;
  vertical-align:top;
  padding:0 0 40px 50px;
}
#user_voice .usericon{
  float:left;
  width:50px;
}
#user_voice .uservoice{
  float:left;
  width:320px;
  padding:0 0 0 20px;
  line-height:1.3em;
}
#user_voice .uservoice_l{
  float:left;
  width:720px;
  padding:0 0 0 20px;
  line-height:1.6em;
}


#service {
  background:#fcf8ec;
  padding:20px 50px 20px 50px;
}
#service .item{
  border:2px solid #ffba55;
  padding:16px 24px 16px 24px;
  margin-bottom:20px;
  
}
@media screen and (max-device-width: 950px) {
  #service .item{
    background-color: rgba(255, 255, 255, 0.7);
  }
}
#service h3{
  font-size:1.5em;
  font-weight:bold;
  color:#a93c34;
}
#service .detail {
  font-size:1.125em;
  line-height:1.5em;
  padding:12px 0 0 4px;
}
#service .sbg01 { background:#ffffff url(../images/sbg01.jpg) top right no-repeat; background-size:contain;}
#service .sbg02 { background:#ffffff url(../images/sbg02.jpg) top right no-repeat; background-size:contain; }
#service .sbg03 { background:#ffffff url(../images/sbg03.jpg) top right no-repeat; background-size:contain; }
#service .sbg04 { background:#ffffff url(../images/sbg04.jpg) top right no-repeat; background-size:contain; }
#service .btn{
  text-align:center;
  margin:40px auto;
}


#qa {
  background:#ffffff;
  padding:20px 50px 20px 50px;
}
#qa .qa_q {
  display: table-cell;
  vertical-align:middle;
  line-height:1.2em;
  height:54px;
  font-size:1.25em;
  font-weight:bold;
  color:#a93c34;
  background:url(../images/q_icon.png) left no-repeat;
  padding-left:70px;
}
#qa .qa_a {
  margin:18px 0 20px 4px;
  line-height:1.6em;
}
#qa .answer {
  color:#a93c34;
  font-size:1.625em;
}


#price {
  background:#ffffff;
  padding:20px 50px 20px 50px;
}
#price p {
  padding:14px 0;
}
#price .btn{
  text-align:center;
  margin:20px auto;
}
#price .service {
  color:#a93c34;
  font-size:1.75em;
  font-weight:bold;
  text-align:center;
  padding:20px 0 0 0;
}

#about {
  background:#ffffff;
  padding:20px 50px 20px 50px;
}
#about .contents {
  display:table;
  margin:30px auto;
}
#about .sample {
  display:table-cell;
  text-align:center;
  padding:0 2% 0 2%;
}
#about .providers {
  display:block;
  width:90%;
  color:#ffffff;
  font-weight:bold;
  text-align:center;
  margin:0 auto;
  padding:6px 0 4px 0;
  background:#eb373a;
}
#about .providerslist {
  display:table;
  margin:10px auto;
  width:90%;
}
#about .provider {
  display:table-cell;
  font-size:0.95em;
  padding:0 1% 0 0;
  line-height:1.3em;
}

.flow {
  background:#ffffff;
  padding:20px 50px 30px 50px;
}
.flow ul{
  list-style:none;
  line-height:1.3em;
}
.flow li {
  background:url(../images/dot.gif) left no-repeat;
  padding:1em 0 1em 2em;
}

#footer {
  border-top:1px solid #929292;
  color:#444444;
  background:#f5f5f5;
  font-size:0.875em;
  text-align:center;
  margin:20px 0 0 0;
  padding:10px 0 40px 0;
}

/* -------------------------------------------------------------------------------- */
/* Trial */

#trial_merit {
  background:#ffffff;
}

#trial_merit ul {
  list-style : none;
  padding:28px 35px 30px 35px;
}
#trial_merit li {
  float:left;
  padding:10px 12px;
}

#trial {
  clear:both;
  background:#ffffff;
  padding:20px 50px 30px 50px;
}
#trial ul{
  padding-left:20px;
  line-height:2em;
}
#trial h3{
  font-size:1.25em;
  text-align:center;
  margin:28px 0 8px 0;
}
#trial .btn{
  text-align:center;
  margin:50px auto 20px;
}

#trial table {
  width:100%;
  border-collapse:collapse;
  border:1px solid #9f9f9f;
  margin:0 auto;
}
#trial th {
  color:#ffffff;
  background:#aa281a;
  border:1px solid #9f9f9f;
  font-size:1.25em;
  text-align:center;
  padding:16px 0 14px 0;
}
#trial td {
  font-size:0.875em;
  line-height:2em;
  border:1px solid #9f9f9f;
  padding:10px 10px 10px 10px;
}
#trial .month {
  font-size:1em;
  text-align:center;
}
#trial tr:nth-child(2n) {
  background:#e9e9e9;
}

#qa .qa_qg {
  background:url(../images/q_icon_green.png) left no-repeat;
  color:#25bca9;
}
#qa .answer_g {
  color:#25bca9;
}


/* -------------------------------------------------------------------------------- */
/* Course Title */

#coursetitle {
  clear:both;
  background:#ffffff;
  padding:20px 20px 30px 20px;
}
#coursetitle table {
  width:100%;
  border-collapse:collapse;
  border:1px solid #9f9f9f;
  margin:0 auto;
}
#coursetitle th {
  color:#ffffff;
  background:#aa281a;
  border:1px solid #9f9f9f;
  font-size:0.875em;
  text-align:center;
  padding:16px 0 14px 0;
}
#coursetitle td {
  font-size:0.875em;
  line-height:1.6em;
  border:1px solid #9f9f9f;
  padding:10px 10px 10px 10px;
}

#coursetitle td.category {
  text-align:center;
}

#coursetitle td.number {
  text-align:right;
}



/* -------------------------------------------------------------------------------- */

.next_r {
  position:relative;
  color:#ffffff;
  /* font-size:30px; */
  font-size:1.875em;
  font-weight:bold;
  text-align:center;
  padding:28px 0 26px 0;
  background:#a93c34;
  margin-bottom:20px;
}
.next_r:after {
  content:' ';
  height:0;
  position:absolute;
  width:0;
  border:20px solid transparent;
  border-top-color:#a93c34;
  top:100%;
  left:50%;
  margin-top:-1px;
  margin-left:-20px;
}
.next_rn {
  padding:16px 0 14px 0;
}
.next_rn2 {
  position:relative;
  color:#ffffff;
  font-size:1.5em;
  font-weight:bold;
  text-align:center;
  padding:8px 0 6px 0;
  background:#a93c34;
}

.next_o {
  position:relative;
  color:#ffffff;
  /* font-size:30px; */
  font-size:1.875em;
  font-weight:bold;
  text-align:center;
  padding:28px 0 26px 0;
  background:#ff7e00;
  margin-bottom:20px;
}
.next_o:after {
  content:' ';
  height:0;
  position:absolute;
  width:0;
  border:20px solid transparent;
  border-top-color:#ff7e00;
  top:100%;
  left:50%;
  margin-top:-1px;
  margin-left:-20px;
}

.next_gn {
  position:relative;
  color:#ffffff;
  /* font-size:30px; */
  font-size:1.875em;
  font-weight:bold;
  text-align:center;
  padding:16px 0 14px 0;
  background:#2ac7b3;
  margin-bottom:20px;
}
.next_gn:after {
    content:' ';
    height:0;
    position:absolute;
    width:0;
    border:20px solid transparent;
    border-top-color:#2ac7b3;
    top:100%;
    left:50%;
    margin-top:-1px;
    margin-left:-20px;
}

.next_arrow {
  text-align:center;
  margin:0 auto;
  padding:0;
  max-height:19px;
}

.bg_orange {
  background:#fcf8ec;
}
